//! Command Palette: Ctrl+K modal overlay with filtered command list.
//!
//! Spotlight-style floating panel centered in the window.

use gpui::*;

use crate::state::AppState;
use crate::theme;

// ── Command Row ─────────────────────────────────────────────────────

fn command_row(label: &str, shortcut: Option<&str>, index: usize) -> Stateful<Div> {
    div()
        .id(SharedString::from(format!("cmd-{index}")))
        .w_full()
        .flex()
        .flex_row()
        .items_center()
        .justify_between()
        .px(px(12.0))
        .py(px(6.0))
        .rounded(px(4.0))
        .cursor_pointer()
        .hover(|s| s.bg(theme::blue_tint()))
        .child(
            div()
                .text_size(px(13.0))
                .text_color(theme::TEXT)
                .child(label.to_string()),
        )
        .child(
            if let Some(sc) = shortcut {
                div()
                    .px(px(6.0))
                    .py(px(2.0))
                    .rounded(px(3.0))
                    .bg(theme::SURFACE0)
                    .text_size(px(10.0))
                    .text_color(theme::SUBTEXT0)
                    .child(sc.to_string())
            } else {
                div()
            },
        )
}

// ── CommandPalette View ─────────────────────────────────────────────

pub struct CommandPalette {
    app_state: Entity<AppState>,
}

impl CommandPalette {
    pub fn new(app_state: Entity<AppState>) -> Self {
        Self { app_state }
    }
}

impl Render for CommandPalette {
    fn render(&mut self, _window: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
        let state = self.app_state.read(cx);
        let commands = state.filtered_commands();
        let query = state.palette_query.clone();

        // Full-screen overlay with semi-transparent backdrop
        div()
            .id("palette-backdrop")
            .absolute()
            .top(px(0.0))
            .left(px(0.0))
            .size_full()
            .flex()
            .items_start()
            .justify_center()
            .pt(px(80.0))
            .bg(theme::with_alpha(theme::CRUST, 0.60))
            .on_mouse_down(MouseButton::Left, {
                let app_state = self.app_state.clone();
                move |_ev: &MouseDownEvent, _win: &mut Window, cx: &mut App| {
                    app_state.update(cx, |s, cx| {
                        s.palette_open = false;
                        cx.notify();
                    });
                }
            })
            // Palette card
            .child(
                div()
                    .id("palette-card")
                    .w(px(480.0))
                    .max_h(px(360.0))
                    .flex()
                    .flex_col()
                    .bg(theme::MANTLE)
                    .rounded(px(12.0))
                    .border_1()
                    .border_color(theme::SURFACE1)
                    .shadow_lg()
                    .overflow_hidden()
                    // Search input
                    .child(
                        div()
                            .w_full()
                            .px(px(14.0))
                            .py(px(10.0))
                            .border_b_1()
                            .border_color(theme::SURFACE0)
                            .child(
                                div()
                                    .w_full()
                                    .h(px(32.0))
                                    .px(px(10.0))
                                    .flex()
                                    .items_center()
                                    .rounded(px(6.0))
                                    .bg(theme::SURFACE0)
                                    .text_size(px(13.0))
                                    .text_color(if query.is_empty() {
                                        theme::OVERLAY0
                                    } else {
                                        theme::TEXT
                                    })
                                    .child(if query.is_empty() {
                                        "Type a command...".to_string()
                                    } else {
                                        query
                                    }),
                            ),
                    )
                    // Command list
                    .child({
                        let mut list = div()
                            .id("palette-list")
                            .flex_1()
                            .w_full()
                            .flex()
                            .flex_col()
                            .p(px(6.0))
                            .gap(px(2.0))
                            .overflow_y_scroll();

                        for (i, cmd) in commands.iter().enumerate() {
                            list = list.child(command_row(cmd.label, cmd.shortcut, i));
                        }

                        if commands.is_empty() {
                            list = list.child(
                                div()
                                    .w_full()
                                    .py(px(20.0))
                                    .flex()
                                    .justify_center()
                                    .text_size(px(13.0))
                                    .text_color(theme::OVERLAY0)
                                    .child("No matching commands"),
                            );
                        }

                        list
                    }),
            )
    }
}
