Implement calendar context menu with event creation modal
- Add CalendarContextMenu component for right-click on calendar days - Add CreateEventModal component with comprehensive event creation form - Integrate context menu detection to avoid conflicts between event/calendar menus - Add form validation and date/time selection with all-day toggle - Connect modal through component hierarchy from app to calendar 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
		
							
								
								
									
										47
									
								
								src/components/calendar_context_menu.rs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										47
									
								
								src/components/calendar_context_menu.rs
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,47 @@ | ||||
| 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> | ||||
|     } | ||||
| } | ||||
		Reference in New Issue
	
	Block a user
	 Connor Johnstone
					Connor Johnstone