connor/calendar
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

Fix calendar event fetching to use visible date range
Some checks failed
Build and Push Docker Image / docker (push) Failing after 1m7s
Details

Browse Source 
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>
This commit is contained in:
Connor Johnstone
2025-09-01 18:31:51 -04:00
parent e55e6bf4dd
commit 79f287ed61
38 changed files with 3922 additions and 2590 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
frontend/src/components/month_view.rs
View File

@@ -1,10 +1,10 @@
use yew::prelude::*;
use crate::models::ical::VEvent;
use crate::services::calendar_service::UserInfo;
use chrono::{Datelike, NaiveDate, Weekday};
use std::collections::HashMap;
use web_sys::window;
use wasm_bindgen::{prelude::*, JsCast};
use crate::services::calendar_service::UserInfo;
use crate::models::ical::VEvent;
use web_sys::window;
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct MonthViewProps {
@@ -52,30 +52,33 @@ pub fn month_view(props: &MonthViewProps) -> Html {
let calculate_max_events = calculate_max_events.clone();
use_effect_with((), move |_| {
let calculate_max_events_clone = calculate_max_events.clone();
// Initial calculation with a slight delay to ensure DOM is ready
if let Some(window) = window() {
let timeout_closure = Closure::wrap(Box::new(move || {
calculate_max_events_clone();
}) as Box<dyn FnMut()>);
let _ = window.set_timeout_with_callback_and_timeout_and_arguments_0(
timeout_closure.as_ref().unchecked_ref(),
100,
);
timeout_closure.forget();
}
// Setup resize listener
let resize_closure = Closure::wrap(Box::new(move || {
calculate_max_events();
}) as Box<dyn Fn()>);
if let Some(window) = window() {
let _ = window.add_event_listener_with_callback("resize", resize_closure.as_ref().unchecked_ref());
let _ = window.add_event_listener_with_callback(
"resize",
resize_closure.as_ref().unchecked_ref(),
);
resize_closure.forget(); // Keep the closure alive
}
|| {}
});
}
@@ -84,8 +87,11 @@ pub fn month_view(props: &MonthViewProps) -> Html {
let get_event_color = |event: &VEvent| -> String {
if let Some(user_info) = &props.user_info {
if let Some(calendar_path) = &event.calendar_path {
if let Some(calendar) = user_info.calendars.iter()
.find(|cal| &cal.path == calendar_path) {
if let Some(calendar) = user_info
.calendars
.iter()
.find(|cal| &cal.path == calendar_path)
{
return calendar.color.clone();
}
}
@@ -103,7 +109,7 @@ pub fn month_view(props: &MonthViewProps) -> Html {
<div class="weekday-header">{"Thu"}</div>
<div class="weekday-header">{"Fri"}</div>
<div class="weekday-header">{"Sat"}</div>
// Days from previous month (grayed out)
{
days_from_prev_month.iter().map(|day| {
@@ -112,7 +118,7 @@ pub fn month_view(props: &MonthViewProps) -> Html {
}
}).collect::<Html>()
}
// Days of the current month
{
(1..=days_in_month).map(|day| {
@@ -120,16 +126,16 @@ pub fn month_view(props: &MonthViewProps) -> Html {
let is_today = date == props.today;
let is_selected = props.selected_date == Some(date);
let day_events = props.events.get(&date).cloned().unwrap_or_default();
// Calculate visible events and overflow
let max_events = *max_events_per_day as usize;
let visible_events: Vec<_> = day_events.iter().take(max_events).collect();
let hidden_count = day_events.len().saturating_sub(max_events);
html! {
<div
<div
class={classes!(
"calendar-day",
"calendar-day",
if is_today { Some("today") } else { None },
if is_selected { Some("selected") } else { None }
)}
@@ -162,7 +168,7 @@ pub fn month_view(props: &MonthViewProps) -> Html {
visible_events.iter().map(|event| {
let event_color = get_event_color(event);
let is_refreshing = props.refreshing_event_uid.as_ref() == Some(&event.uid);
let onclick = {
let on_event_click = props.on_event_click.clone();
let event = (*event).clone();
@@ -170,7 +176,7 @@ pub fn month_view(props: &MonthViewProps) -> Html {
on_event_click.emit(event.clone());
})
};
let oncontextmenu = {
if let Some(callback) = &props.on_event_context_menu {
let callback = callback.clone();
@@ -183,9 +189,9 @@ pub fn month_view(props: &MonthViewProps) -> Html {
None
}
};
html! {
<div
<div
class={classes!("event-box", if is_refreshing { Some("refreshing") } else { None })}
style={format!("background-color: {}", event_color)}
{onclick}
@@ -212,7 +218,7 @@ pub fn month_view(props: &MonthViewProps) -> Html {
}
}).collect::<Html>()
}
{ render_next_month_days(days_from_prev_month.len(), days_in_month) }
</div>
}
@@ -221,20 +227,34 @@ pub fn month_view(props: &MonthViewProps) -> Html {
fn render_next_month_days(prev_days_count: usize, current_days_count: u32) -> Html {
let total_slots = 42; // 6 rows x 7 days
let used_slots = prev_days_count + current_days_count as usize;
let remaining_slots = if used_slots < total_slots { total_slots - used_slots } else { 0 };
(1..=remaining_slots).map(|day| {
html! {
<div class="calendar-day next-month">{day}</div>
}
}).collect::<Html>()
let remaining_slots = if used_slots < total_slots {
total_slots - used_slots
} else {
0
};
(1..=remaining_slots)
.map(|day| {
html! {
<div class="calendar-day next-month">{day}</div>
}
})
.collect::<Html>()
}
fn get_days_in_month(date: NaiveDate) -> u32 {
NaiveDate::from_ymd_opt(
if date.month() == 12 { date.year() + 1 } else { date.year() },
if date.month() == 12 { 1 } else { date.month() + 1 },
1
if date.month() == 12 {
date.year() + 1
} else {
date.year()
},
if date.month() == 12 {
1
} else {
date.month() + 1
},
1,
)
.unwrap()
.pred_opt()
@@ -252,7 +272,7 @@ fn get_days_from_previous_month(current_month: NaiveDate, first_weekday: Weekday
Weekday::Fri => 5,
Weekday::Sat => 6,
};
if days_before == 0 {
vec![]
} else {
@@ -261,8 +281,8 @@ fn get_days_from_previous_month(current_month: NaiveDate, first_weekday: Weekday
} else {
NaiveDate::from_ymd_opt(current_month.year(), current_month.month() - 1, 1).unwrap()
};
let prev_month_days = get_days_in_month(prev_month);
((prev_month_days - days_before as u32 + 1)..=prev_month_days).collect()
}
}
}