use yew::prelude::*;
use web_sys::MouseEvent;

#[derive(Properties, PartialEq)]
pub struct CalendarContextMenuProps {
    pub is_open: bool,
    pub x: i32,
    pub y: i32,
    pub on_close: Callback<()>,
    pub on_create_event: Callback<MouseEvent>,
}

#[function_component(CalendarContextMenu)]
pub fn calendar_context_menu(props: &CalendarContextMenuProps) -> Html {
    let menu_ref = use_node_ref();
    
    if !props.is_open {
        return html! {};
    }

    let style = format!(
        "position: fixed; left: {}px; top: {}px; z-index: 1001;",
        props.x, props.y
    );

    let on_create_event_click = {
        let on_create_event = props.on_create_event.clone();
        let on_close = props.on_close.clone();
        Callback::from(move |e: MouseEvent| {
            on_create_event.emit(e);
            on_close.emit(());
        })
    };

    html! {
        <div 
            ref={menu_ref}
            class="context-menu" 
            style={style}
        >
            <div class="context-menu-item context-menu-create" onclick={on_create_event_click}>
                <span class="context-menu-icon">{"+"}</span>
                {"Create Event"}
            </div>
        </div>
    }
}