fix(mcp): keep server configuration inline in MCP panel (#238)

Replace separate card/modal UI with inline form for Add MCP Server.
Configuration now happens directly within the MCP Servers panel instead
of opening a separate McpCard overlay.

Changes:
- Add InlineFormField and InlineFormState types for inline forms
- Add form rendering support to InteractiveWidget
- Add form input handling to interactive handlers
- Add FormSubmitted result variant to InteractiveResult
- Modify __add__ action to open inline form instead of McpCard
- Add handle_inline_form_submission for processing form data

This keeps the UX consistent - all MCP configuration stays in the same
panel where servers are listed.

Co-authored-by: Droid Agent <droid@factory.ai>

Author: echobt

cortex-tui/src/interactive/builders/mcp.rs

@@ -1,6 +1,8 @@
 //! Builder for MCP server selection.
 
-use crate::interactive::state::{InteractiveAction, InteractiveItem, InteractiveState};
+use crate::interactive::state::{
+    InlineFormField, InlineFormState, InteractiveAction, InteractiveItem, InteractiveState,
+};
 use crate::modal::mcp_manager::{McpServerInfo, McpStatus};
 
 /// Build an interactive state for MCP server management.
@@ -74,6 +76,23 @@ pub fn build_mcp_selector(servers: &[McpServerInfo]) -> InteractiveState {
         ])
 }
 
+/// Build an inline form for adding a new MCP server.
+/// This form is displayed within the MCP panel, not as a separate modal.
+pub fn build_mcp_add_server_form() -> InlineFormState {
+    InlineFormState::new("Add MCP Server", "mcp-add")
+        .with_field(
+            InlineFormField::new("name", "Name")
+                .required()
+                .with_placeholder("server-name"),
+        )
+        .with_field(
+            InlineFormField::new("command", "Command")
+                .required()
+                .with_placeholder("npx, uvx, or path/to/binary"),
+        )
+        .with_field(InlineFormField::new("args", "Args").with_placeholder("arg1 arg2 ..."))
+}
+
 /// Build an interactive state for MCP server actions (for a specific server).
 pub fn build_mcp_server_actions(server: &McpServerInfo) -> InteractiveState {
     let mut items = Vec::new();

cortex-tui/src/interactive/builders/mod.rs

@@ -28,7 +28,7 @@ pub use files::{build_context_list, build_context_remove, build_file_browser};
 pub use login::{
     LoginFlowState, LoginStatus, build_already_logged_in_selector, build_login_selector,
 };
-pub use mcp::build_mcp_selector;
+pub use mcp::{build_mcp_add_server_form, build_mcp_selector};
 pub use model::build_model_selector;
 // pub use provider::build_provider_selector; // REMOVED (single Cortex provider)
 pub use resume_picker::build_resume_picker;

cortex-tui/src/interactive/handlers.rs

@@ -2,11 +2,17 @@
 
 use super::state::{InteractiveAction, InteractiveResult, InteractiveState};
 use crossterm::event::{KeyCode, KeyEvent, KeyModifiers};
+use std::collections::HashMap;
 
 /// Handle a key event in interactive mode.
 ///
 /// Returns an `InteractiveResult` indicating what action to take.
 pub fn handle_interactive_key(state: &mut InteractiveState, key: KeyEvent) -> InteractiveResult {
+    // If inline form is active, handle form input
+    if state.is_form_active() {
+        return handle_form_key(state, key);
+    }
+
     match key.code {
         // Navigation
         KeyCode::Up | KeyCode::Char('k')
@@ -139,6 +145,72 @@ pub fn handle_interactive_key(state: &mut InteractiveState, key: KeyEvent) -> In
     }
 }
 
+/// Handle key events when inline form is active.
+fn handle_form_key(state: &mut InteractiveState, key: KeyEvent) -> InteractiveResult {
+    match key.code {
+        // Submit form with Enter
+        KeyCode::Enter => {
+            if let Some(ref form) = state.inline_form {
+                if form.is_valid() {
+                    let action_id = form.action_id.clone();
+                    let values: HashMap<String, String> = form
+                        .fields
+                        .iter()
+                        .map(|f| (f.name.clone(), f.value.clone()))
+                        .collect();
+                    state.close_form();
+                    return InteractiveResult::FormSubmitted { action_id, values };
+                }
+            }
+            InteractiveResult::Continue
+        }
+
+        // Cancel form with Esc
+        KeyCode::Esc => {
+            state.close_form();
+            InteractiveResult::Continue
+        }
+
+        // Navigate fields with Tab
+        KeyCode::Tab => {
+            if let Some(ref mut form) = state.inline_form {
+                form.focus_next();
+            }
+            InteractiveResult::Continue
+        }
+
+        // Navigate fields with Shift+Tab
+        KeyCode::BackTab => {
+            if let Some(ref mut form) = state.inline_form {
+                form.focus_prev();
+            }
+            InteractiveResult::Continue
+        }
+
+        // Type characters into focused field
+        KeyCode::Char(c) => {
+            if let Some(ref mut form) = state.inline_form {
+                if let Some(ref mut field) = form.focused_mut() {
+                    field.value.push(c);
+                }
+            }
+            InteractiveResult::Continue
+        }
+
+        // Backspace
+        KeyCode::Backspace => {
+            if let Some(ref mut form) = state.inline_form {
+                if let Some(ref mut field) = form.focused_mut() {
+                    field.value.pop();
+                }
+            }
+            InteractiveResult::Continue
+        }
+
+        _ => InteractiveResult::Continue,
+    }
+}
+
 /// Check if a character is a shortcut for any item.
 fn is_shortcut(state: &InteractiveState, c: char) -> bool {
     state.items.iter().any(|item| item.shortcut == Some(c))

cortex-tui/src/interactive/mod.rs

@@ -54,5 +54,6 @@ pub mod state;
 pub use handlers::handle_interactive_key;
 pub use renderer::InteractiveWidget;
 pub use state::{
-    InputMode, InteractiveAction, InteractiveItem, InteractiveResult, InteractiveState,
+    InlineFormField, InlineFormState, InputMode, InteractiveAction, InteractiveItem,
+    InteractiveResult, InteractiveState,
 };

cortex-tui/src/interactive/renderer.rs

@@ -1,10 +1,7 @@
 //! Renderer for interactive selection in the input area.
 
-use super::state::{InteractiveItem, InteractiveState};
-use crate::ui::consts::border;
-use cortex_core::style::{
-    BORDER, CYAN_PRIMARY, SUCCESS, SURFACE_0, SURFACE_1, TEXT, TEXT_DIM, TEXT_MUTED, VOID, WARNING,
-};
+use super::state::{InlineFormState, InteractiveItem, InteractiveState};
+use cortex_core::style::{CYAN_PRIMARY, SUCCESS, SURFACE_1, TEXT, TEXT_DIM, TEXT_MUTED};
 use ratatui::{
     buffer::Buffer,
     layout::{Constraint, Layout, Rect},
@@ -39,6 +36,16 @@ impl<'a> InteractiveWidget<'a> {
 
     /// Calculate the required height for this widget.
     pub fn required_height(&self) -> u16 {
+        // If inline form is active, calculate form height
+        if let Some(ref form) = self.state.inline_form {
+            let fields_count = form.fields.len() as u16;
+            let header_height = 1; // Title
+            let hints_height = 1;
+            let border_height = 2;
+            // Each field takes 2 lines (label + input)
+            return (fields_count * 2) + header_height + hints_height + border_height;
+        }
+
         let items_count = self
             .state
             .filtered_indices
@@ -58,6 +65,12 @@ impl<'a> Widget for InteractiveWidget<'a> {
         // Clear the area first
         Clear.render(area, buf);
 
+        // If inline form is active, render the form instead
+        if let Some(ref form) = self.state.inline_form {
+            self.render_form(form, area, buf);
+            return;
+        }
+
         // Draw border with rounded corners
         let block = Block::default()
             .borders(Borders::ALL)
@@ -297,6 +310,154 @@ impl<'a> InteractiveWidget<'a> {
         let hints_line = Line::from(spans);
         Paragraph::new(hints_line).render(area, buf);
     }
+
+    /// Render inline form for configuration within the panel.
+    fn render_form(&self, form: &InlineFormState, area: Rect, buf: &mut Buffer) {
+        // Draw border with form title
+        let block = Block::default()
+            .borders(Borders::ALL)
+            .border_set(ROUNDED_BORDER)
+            .border_style(Style::default().fg(CYAN_PRIMARY))
+            .title(Span::styled(
+                format!(" {} ", form.title),
+                Style::default()
+                    .fg(CYAN_PRIMARY)
+                    .add_modifier(Modifier::BOLD),
+            ));
+
+        let inner = block.inner(area);
+        block.render(area, buf);
+
+        if inner.height < 3 {
+            return;
+        }
+
+        // Calculate field layout: each field takes 1 line (label: value)
+        let fields_count = form.fields.len();
+        let mut constraints: Vec<Constraint> =
+            form.fields.iter().map(|_| Constraint::Length(1)).collect();
+        constraints.push(Constraint::Min(0)); // Spacer
+        constraints.push(Constraint::Length(1)); // Hints
+
+        let chunks = Layout::vertical(constraints).split(inner);
+
+        // Render each field
+        for (i, field) in form.fields.iter().enumerate() {
+            if i >= chunks.len().saturating_sub(2) {
+                break;
+            }
+            let field_area = chunks[i];
+            let is_focused = i == form.focused_field;
+
+            self.render_form_field(field_area, buf, field, is_focused);
+        }
+
+        // Render form hints
+        let hints_area = chunks[fields_count + 1];
+        self.render_form_hints(hints_area, buf);
+    }
+
+    /// Render a single form field.
+    fn render_form_field(
+        &self,
+        area: Rect,
+        buf: &mut Buffer,
+        field: &super::state::InlineFormField,
+        is_focused: bool,
+    ) {
+        let x = area.x + 1;
+
+        // Label
+        let label_style = if is_focused {
+            Style::default()
+                .fg(CYAN_PRIMARY)
+                .add_modifier(Modifier::BOLD)
+        } else {
+            Style::default().fg(TEXT_DIM)
+        };
+
+        let required_marker = if field.required { "*" } else { "" };
+        let label = format!("{}{}:", field.label, required_marker);
+        buf.set_string(x, area.y, &label, label_style);
+
+        // Value or placeholder
+        let value_x = x + label.len() as u16 + 1;
+        let remaining_width = area.width.saturating_sub(value_x - area.x + 1);
+
+        if field.value.is_empty() && !is_focused {
+            // Show placeholder
+            let placeholder = if field.placeholder.len() > remaining_width as usize {
+                format!("{}...", &field.placeholder[..remaining_width as usize - 3])
+            } else {
+                field.placeholder.clone()
+            };
+            buf.set_string(
+                value_x,
+                area.y,
+                &placeholder,
+                Style::default().fg(TEXT_MUTED),
+            );
+        } else {
+            // Show value with cursor if focused
+            let display_value = if field.value.len() > remaining_width as usize - 1 {
+                format!(
+                    "...{}",
+                    &field.value[field.value.len() - (remaining_width as usize - 4)..]
+                )
+            } else {
+                field.value.clone()
+            };
+
+            let value_style = if is_focused {
+                Style::default().fg(TEXT).bg(SURFACE_1)
+            } else {
+                Style::default().fg(TEXT)
+            };
+
+            // Draw input background if focused
+            if is_focused {
+                for xi in value_x..(value_x + remaining_width) {
+                    buf[(xi, area.y)].set_bg(SURFACE_1);
+                }
+            }
+
+            buf.set_string(value_x, area.y, &display_value, value_style);
+
+            // Draw cursor
+            if is_focused {
+                let cursor_x = value_x + display_value.len() as u16;
+                if cursor_x < area.x + area.width - 1 {
+                    buf[(cursor_x, area.y)].set_char('_');
+                    buf[(cursor_x, area.y)].set_fg(CYAN_PRIMARY);
+                }
+            }
+        }
+    }
+
+    /// Render hints for the form.
+    fn render_form_hints(&self, area: Rect, buf: &mut Buffer) {
+        let hints = vec![("Tab", "next"), ("Enter", "submit"), ("Esc", "cancel")];
+
+        let dark_green = Color::Rgb(0, 100, 0);
+
+        let mut spans = Vec::new();
+        for (i, (key, action)) in hints.iter().enumerate() {
+            if i > 0 {
+                spans.push(Span::styled("  ", Style::default()));
+            }
+            spans.push(Span::styled(
+                format!("[{}]", key),
+                Style::default().fg(dark_green),
+            ));
+            spans.push(Span::styled(
+                format!(" {}", action),
+                Style::default().fg(dark_green),
+            ));
+        }
+
+        let hints_line = Line::from(spans);
+        Paragraph::new(hints_line).render(area, buf);
+    }
 }
 
 #[cfg(test)]