Files
calendar/frontend/src/components/calendar_list_item.rs
Connor Johnstone 79f287ed61
Some checks failed
Build and Push Docker Image / docker (push) Failing after 1m7s
Fix calendar event fetching to use visible date range
Moved event fetching logic from CalendarView to Calendar component to properly
use the visible date range instead of hardcoded current month. The Calendar
component already tracks the current visible date through navigation, so events
now load correctly for August and other months when navigating.

Changes:
- Calendar component now manages its own events state and fetching
- Event fetching responds to current_date changes from navigation
- CalendarView simplified to just render Calendar component
- Fixed cargo fmt/clippy formatting across codebase

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-09-01 18:31:51 -04:00

76 lines
3.1 KiB
Rust

use crate::services::calendar_service::CalendarInfo;
use web_sys::MouseEvent;
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct CalendarListItemProps {
pub calendar: CalendarInfo,
pub color_picker_open: bool,
pub on_color_change: Callback<(String, String)>, // (calendar_path, color)
pub on_color_picker_toggle: Callback<String>, // calendar_path
pub available_colors: Vec<String>,
pub on_context_menu: Callback<(MouseEvent, String)>, // (event, calendar_path)
}
#[function_component(CalendarListItem)]
pub fn calendar_list_item(props: &CalendarListItemProps) -> Html {
let on_color_click = {
let cal_path = props.calendar.path.clone();
let on_color_picker_toggle = props.on_color_picker_toggle.clone();
Callback::from(move |e: MouseEvent| {
e.stop_propagation();
on_color_picker_toggle.emit(cal_path.clone());
})
};
let on_context_menu = {
let cal_path = props.calendar.path.clone();
let on_context_menu = props.on_context_menu.clone();
Callback::from(move |e: MouseEvent| {
e.prevent_default();
on_context_menu.emit((e, cal_path.clone()));
})
};
html! {
<li key={props.calendar.path.clone()} oncontextmenu={on_context_menu}>
<span class="calendar-color"
style={format!("background-color: {}", props.calendar.color)}
onclick={on_color_click}>
{
if props.color_picker_open {
html! {
<div class="color-picker">
{
props.available_colors.iter().map(|color| {
let color_str = color.clone();
let cal_path = props.calendar.path.clone();
let on_color_change = props.on_color_change.clone();
let on_color_select = Callback::from(move |_: MouseEvent| {
on_color_change.emit((cal_path.clone(), color_str.clone()));
});
let is_selected = props.calendar.color == *color;
let class_name = if is_selected { "color-option selected" } else { "color-option" };
html! {
<div class={class_name}
style={format!("background-color: {}", color)}
onclick={on_color_select}>
</div>
}
}).collect::<Html>()
}
</div>
}
} else {
html! {}
}
}
</span>
<span class="calendar-name">{&props.calendar.display_name}</span>
</li>
}
}