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

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

File diff suppressed because it is too large Load Diff

View File

@@ -34,14 +34,14 @@ impl AuthService {
let base_url = option_env!("BACKEND_API_URL")
.unwrap_or("http://localhost:3000/api")
.to_string();
Self { base_url }
}
pub async fn login(&self, request: CalDAVLoginRequest) -> Result<AuthResponse, String> {
self.post_json("/auth/login", &request).await
}
// Helper method for POST requests with JSON body
async fn post_json<T: Serialize, R: for<'de> Deserialize<'de>>(
&self,
@@ -49,9 +49,9 @@ impl AuthService {
body: &T,
) -> Result<R, String> {
let window = web_sys::window().ok_or("No global window exists")?;
let json_body = serde_json::to_string(body)
.map_err(|e| format!("JSON serialization failed: {}", e))?;
let json_body =
serde_json::to_string(body).map_err(|e| format!("JSON serialization failed: {}", e))?;
let opts = RequestInit::new();
opts.set_method("POST");
@@ -62,23 +62,27 @@ impl AuthService {
let request = Request::new_with_str_and_init(&url, &opts)
.map_err(|e| format!("Request creation failed: {:?}", e))?;
request.headers().set("Content-Type", "application/json")
request
.headers()
.set("Content-Type", "application/json")
.map_err(|e| format!("Header setting failed: {:?}", e))?;
let resp_value = JsFuture::from(window.fetch_with_request(&request))
.await
.map_err(|e| format!("Network request failed: {:?}", e))?;
let resp: Response = resp_value.dyn_into()
let resp: Response = resp_value
.dyn_into()
.map_err(|e| format!("Response cast failed: {:?}", e))?;
let text = JsFuture::from(resp.text()
.map_err(|e| format!("Text extraction failed: {:?}", e))?)
.await
.map_err(|e| format!("Text promise failed: {:?}", e))?;
let text = JsFuture::from(
resp.text()
.map_err(|e| format!("Text extraction failed: {:?}", e))?,
)
.await
.map_err(|e| format!("Text promise failed: {:?}", e))?;
let text_string = text.as_string()
.ok_or("Response text is not a string")?;
let text_string = text.as_string().ok_or("Response text is not a string")?;
if resp.ok() {
serde_json::from_str::<R>(&text_string)
@@ -92,4 +96,4 @@ impl AuthService {
}
}
}
}
}

View File

@@ -1,19 +1,16 @@
use yew::prelude::*;
use chrono::{Datelike, Local, NaiveDate, Duration};
use crate::components::{
CalendarHeader, CreateEventModal, EventCreationData, EventModal, MonthView, ViewMode, WeekView,
};
use crate::models::ical::VEvent;
use crate::services::{calendar_service::UserInfo, CalendarService};
use chrono::{Datelike, Duration, Local, NaiveDate};
use gloo_storage::{LocalStorage, Storage};
use std::collections::HashMap;
use web_sys::MouseEvent;
use crate::services::calendar_service::UserInfo;
use crate::models::ical::VEvent;
use crate::components::{EventModal, ViewMode, CalendarHeader, MonthView, WeekView, CreateEventModal, EventCreationData};
use gloo_storage::{LocalStorage, Storage};
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct CalendarProps {
#[prop_or_default]
pub events: HashMap<NaiveDate, Vec<VEvent>>,
pub on_event_click: Callback<VEvent>,
#[prop_or_default]
pub refreshing_event_uid: Option<String>,
#[prop_or_default]
pub user_info: Option<UserInfo>,
#[prop_or_default]
@@ -25,7 +22,17 @@ pub struct CalendarProps {
#[prop_or_default]
pub on_create_event_request: Option<Callback<EventCreationData>>,
#[prop_or_default]
pub on_event_update_request: Option<Callback<(VEvent, chrono::NaiveDateTime, chrono::NaiveDateTime, bool, Option<chrono::DateTime<chrono::Utc>>, Option<String>, Option<String>)>>,
pub on_event_update_request: Option<
Callback<(
VEvent,
chrono::NaiveDateTime,
chrono::NaiveDateTime,
bool,
Option<chrono::DateTime<chrono::Utc>>,
Option<String>,
Option<String>,
)>,
>,
#[prop_or_default]
pub context_menus_open: bool,
}
@@ -33,6 +40,12 @@ pub struct CalendarProps {
#[function_component]
pub fn Calendar(props: &CalendarProps) -> Html {
let today = Local::now().date_naive();
// Event management state
let events = use_state(|| HashMap::<NaiveDate, Vec<VEvent>>::new());
let loading = use_state(|| true);
let error = use_state(|| None::<String>);
let refreshing_event_uid = use_state(|| None::<String>);
// Track the currently selected date (the actual day the user has selected)
let selected_date = use_state(|| {
// Try to load saved selected date from localStorage
@@ -55,20 +68,19 @@ pub fn Calendar(props: &CalendarProps) -> Html {
}
}
});
// Track the display date (what to show in the view)
let current_date = use_state(|| {
match props.view {
ViewMode::Month => selected_date.with_day(1).unwrap_or(*selected_date),
ViewMode::Week => *selected_date,
}
let current_date = use_state(|| match props.view {
ViewMode::Month => selected_date.with_day(1).unwrap_or(*selected_date),
ViewMode::Week => *selected_date,
});
let selected_event = use_state(|| None::<VEvent>);
// State for create event modal
let show_create_modal = use_state(|| false);
let create_event_data = use_state(|| None::<(chrono::NaiveDate, chrono::NaiveTime, chrono::NaiveTime)>);
let create_event_data =
use_state(|| None::<(chrono::NaiveDate, chrono::NaiveTime, chrono::NaiveTime)>);
// State for time increment snapping (15 or 30 minutes)
let time_increment = use_state(|| {
// Try to load saved time increment from localStorage
@@ -82,7 +94,155 @@ pub fn Calendar(props: &CalendarProps) -> Html {
15
}
});
// Fetch events when current_date changes
{
let events = events.clone();
let loading = loading.clone();
let error = error.clone();
let current_date = current_date.clone();
use_effect_with((*current_date, props.view.clone()), move |(date, _view)| {
let auth_token: Option<String> = LocalStorage::get("auth_token").ok();
let date = *date; // Clone the date to avoid lifetime issues
if let Some(token) = auth_token {
let events = events.clone();
let loading = loading.clone();
let error = error.clone();
wasm_bindgen_futures::spawn_local(async move {
let calendar_service = CalendarService::new();
let password = if let Ok(credentials_str) =
LocalStorage::get::<String>("caldav_credentials")
{
if let Ok(credentials) =
serde_json::from_str::<serde_json::Value>(&credentials_str)
{
credentials["password"].as_str().unwrap_or("").to_string()
} else {
String::new()
}
} else {
String::new()
};
let current_year = date.year();
let current_month = date.month();
match calendar_service
.fetch_events_for_month_vevent(
&token,
&password,
current_year,
current_month,
)
.await
{
Ok(vevents) => {
let grouped_events = CalendarService::group_events_by_date(vevents);
events.set(grouped_events);
loading.set(false);
}
Err(err) => {
error.set(Some(format!("Failed to load events: {}", err)));
loading.set(false);
}
}
});
} else {
loading.set(false);
error.set(Some("No authentication token found".to_string()));
}
|| ()
});
}
// Handle event click to refresh individual events
let on_event_click = {
let events = events.clone();
let refreshing_event_uid = refreshing_event_uid.clone();
Callback::from(move |event: VEvent| {
let auth_token: Option<String> = LocalStorage::get("auth_token").ok();
if let Some(token) = auth_token {
let events = events.clone();
let refreshing_event_uid = refreshing_event_uid.clone();
let uid = event.uid.clone();
refreshing_event_uid.set(Some(uid.clone()));
wasm_bindgen_futures::spawn_local(async move {
let calendar_service = CalendarService::new();
let password = if let Ok(credentials_str) =
LocalStorage::get::<String>("caldav_credentials")
{
if let Ok(credentials) =
serde_json::from_str::<serde_json::Value>(&credentials_str)
{
credentials["password"].as_str().unwrap_or("").to_string()
} else {
String::new()
}
} else {
String::new()
};
match calendar_service
.refresh_event(&token, &password, &uid)
.await
{
Ok(Some(refreshed_event)) => {
let refreshed_vevent = refreshed_event;
let mut updated_events = (*events).clone();
for (_, day_events) in updated_events.iter_mut() {
day_events.retain(|e| e.uid != uid);
}
if refreshed_vevent.rrule.is_some() {
let new_occurrences =
CalendarService::expand_recurring_events(vec![
refreshed_vevent.clone(),
]);
for occurrence in new_occurrences {
let date = occurrence.get_date();
updated_events
.entry(date)
.or_insert_with(Vec::new)
.push(occurrence);
}
} else {
let date = refreshed_vevent.get_date();
updated_events
.entry(date)
.or_insert_with(Vec::new)
.push(refreshed_vevent);
}
events.set(updated_events);
}
Ok(None) => {
let mut updated_events = (*events).clone();
for (_, day_events) in updated_events.iter_mut() {
day_events.retain(|e| e.uid != uid);
}
events.set(updated_events);
}
Err(_err) => {}
}
refreshing_event_uid.set(None);
});
}
})
};
// Handle view mode changes - adjust current_date format when switching between month/week
{
let current_date = current_date.clone();
@@ -98,7 +258,7 @@ pub fn Calendar(props: &CalendarProps) -> Html {
|| {}
});
}
let on_prev = {
let current_date = current_date.clone();
let selected_date = selected_date.clone();
@@ -110,19 +270,22 @@ pub fn Calendar(props: &CalendarProps) -> Html {
let prev_month = *current_date - Duration::days(1);
let first_of_prev = prev_month.with_day(1).unwrap();
(first_of_prev, first_of_prev)
},
}
ViewMode::Week => {
// Go to previous week
let prev_week = *selected_date - Duration::weeks(1);
(prev_week, prev_week)
},
}
};
selected_date.set(new_selected);
current_date.set(new_display);
let _ = LocalStorage::set("calendar_selected_date", new_selected.format("%Y-%m-%d").to_string());
let _ = LocalStorage::set(
"calendar_selected_date",
new_selected.format("%Y-%m-%d").to_string(),
);
})
};
let on_next = {
let current_date = current_date.clone();
let selected_date = selected_date.clone();
@@ -134,19 +297,23 @@ pub fn Calendar(props: &CalendarProps) -> Html {
let next_month = if current_date.month() == 12 {
NaiveDate::from_ymd_opt(current_date.year() + 1, 1, 1).unwrap()
} else {
NaiveDate::from_ymd_opt(current_date.year(), current_date.month() + 1, 1).unwrap()
NaiveDate::from_ymd_opt(current_date.year(), current_date.month() + 1, 1)
.unwrap()
};
(next_month, next_month)
},
}
ViewMode::Week => {
// Go to next week
let next_week = *selected_date + Duration::weeks(1);
(next_week, next_week)
},
}
};
selected_date.set(new_selected);
current_date.set(new_display);
let _ = LocalStorage::set("calendar_selected_date", new_selected.format("%Y-%m-%d").to_string());
let _ = LocalStorage::set(
"calendar_selected_date",
new_selected.format("%Y-%m-%d").to_string(),
);
})
};
@@ -160,15 +327,18 @@ pub fn Calendar(props: &CalendarProps) -> Html {
ViewMode::Month => {
let first_of_today = today.with_day(1).unwrap();
(today, first_of_today) // Select today, but display the month
},
}
ViewMode::Week => (today, today), // Select and display today
};
selected_date.set(new_selected);
current_date.set(new_display);
let _ = LocalStorage::set("calendar_selected_date", new_selected.format("%Y-%m-%d").to_string());
let _ = LocalStorage::set(
"calendar_selected_date",
new_selected.format("%Y-%m-%d").to_string(),
);
})
};
// Handle time increment toggle
let on_time_increment_toggle = {
let time_increment = time_increment.clone();
@@ -179,32 +349,68 @@ pub fn Calendar(props: &CalendarProps) -> Html {
let _ = LocalStorage::set("calendar_time_increment", next);
})
};
// Handle drag-to-create event
let on_create_event = {
let show_create_modal = show_create_modal.clone();
let create_event_data = create_event_data.clone();
Callback::from(move |(_date, start_datetime, end_datetime): (NaiveDate, chrono::NaiveDateTime, chrono::NaiveDateTime)| {
// For drag-to-create, we don't need the temporary event approach
// Instead, just pass the local times directly via initial_time props
create_event_data.set(Some((start_datetime.date(), start_datetime.time(), end_datetime.time())));
show_create_modal.set(true);
})
Callback::from(
move |(_date, start_datetime, end_datetime): (
NaiveDate,
chrono::NaiveDateTime,
chrono::NaiveDateTime,
)| {
// For drag-to-create, we don't need the temporary event approach
// Instead, just pass the local times directly via initial_time props
create_event_data.set(Some((
start_datetime.date(),
start_datetime.time(),
end_datetime.time(),
)));
show_create_modal.set(true);
},
)
};
// Handle drag-to-move event
let on_event_update = {
let on_event_update_request = props.on_event_update_request.clone();
Callback::from(move |(event, new_start, new_end, preserve_rrule, until_date, update_scope, occurrence_date): (VEvent, chrono::NaiveDateTime, chrono::NaiveDateTime, bool, Option<chrono::DateTime<chrono::Utc>>, Option<String>, Option<String>)| {
if let Some(callback) = &on_event_update_request {
callback.emit((event, new_start, new_end, preserve_rrule, until_date, update_scope, occurrence_date));
}
})
Callback::from(
move |(
event,
new_start,
new_end,
preserve_rrule,
until_date,
update_scope,
occurrence_date,
): (
VEvent,
chrono::NaiveDateTime,
chrono::NaiveDateTime,
bool,
Option<chrono::DateTime<chrono::Utc>>,
Option<String>,
Option<String>,
)| {
if let Some(callback) = &on_event_update_request {
callback.emit((
event,
new_start,
new_end,
preserve_rrule,
until_date,
update_scope,
occurrence_date,
));
}
},
)
};
html! {
<div class={classes!("calendar", match props.view { ViewMode::Week => Some("week-view"), _ => None })}>
<CalendarHeader
<CalendarHeader
current_date={*current_date}
view_mode={props.view.clone()}
on_prev={on_prev}
@@ -213,9 +419,22 @@ pub fn Calendar(props: &CalendarProps) -> Html {
time_increment={Some(*time_increment)}
on_time_increment_toggle={Some(on_time_increment_toggle)}
/>
{
match props.view {
if *loading {
html! {
<div class="calendar-loading">
<p>{"Loading calendar events..."}</p>
</div>
}
} else if let Some(err) = (*error).clone() {
html! {
<div class="calendar-error">
<p>{format!("Error: {}", err)}</p>
</div>
}
} else {
match props.view {
ViewMode::Month => {
let on_day_select = {
let selected_date = selected_date.clone();
@@ -224,14 +443,14 @@ pub fn Calendar(props: &CalendarProps) -> Html {
let _ = LocalStorage::set("calendar_selected_date", date.format("%Y-%m-%d").to_string());
})
};
html! {
<MonthView
current_month={*current_date}
today={today}
events={props.events.clone()}
on_event_click={props.on_event_click.clone()}
refreshing_event_uid={props.refreshing_event_uid.clone()}
events={(*events).clone()}
on_event_click={on_event_click.clone()}
refreshing_event_uid={(*refreshing_event_uid).clone()}
user_info={props.user_info.clone()}
on_event_context_menu={props.on_event_context_menu.clone()}
on_calendar_context_menu={props.on_calendar_context_menu.clone()}
@@ -244,9 +463,9 @@ pub fn Calendar(props: &CalendarProps) -> Html {
<WeekView
current_date={*current_date}
today={today}
events={props.events.clone()}
on_event_click={props.on_event_click.clone()}
refreshing_event_uid={props.refreshing_event_uid.clone()}
events={(*events).clone()}
on_event_click={on_event_click.clone()}
refreshing_event_uid={(*refreshing_event_uid).clone()}
user_info={props.user_info.clone()}
on_event_context_menu={props.on_event_context_menu.clone()}
on_calendar_context_menu={props.on_calendar_context_menu.clone()}
@@ -257,11 +476,12 @@ pub fn Calendar(props: &CalendarProps) -> Html {
time_increment={*time_increment}
/>
},
}
}
}
// Event details modal
<EventModal
<EventModal
event={(*selected_event).clone()}
on_close={{
let selected_event_clone = selected_event.clone();
@@ -270,7 +490,7 @@ pub fn Calendar(props: &CalendarProps) -> Html {
})
}}
/>
// Create event modal
<CreateEventModal
is_open={*show_create_modal}
@@ -294,7 +514,7 @@ pub fn Calendar(props: &CalendarProps) -> Html {
Callback::from(move |event_data: EventCreationData| {
show_create_modal.set(false);
create_event_data.set(None);
// Emit the create event request to parent
if let Some(callback) = &on_create_event_request {
callback.emit(event_data);
@@ -313,4 +533,4 @@ pub fn Calendar(props: &CalendarProps) -> Html {
/>
</div>
}
}
}

View File

@@ -1,5 +1,5 @@
use yew::prelude::*;
use web_sys::MouseEvent;
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct CalendarContextMenuProps {
@@ -13,7 +13,7 @@ pub struct CalendarContextMenuProps {
#[function_component(CalendarContextMenu)]
pub fn calendar_context_menu(props: &CalendarContextMenuProps) -> Html {
let menu_ref = use_node_ref();
if !props.is_open {
return html! {};
}
@@ -33,9 +33,9 @@ pub fn calendar_context_menu(props: &CalendarContextMenuProps) -> Html {
};
html! {
<div
<div
ref={menu_ref}
class="context-menu"
class="context-menu"
style={style}
>
<div class="context-menu-item context-menu-create" onclick={on_create_event_click}>
@@ -44,4 +44,4 @@ pub fn calendar_context_menu(props: &CalendarContextMenuProps) -> Html {
</div>
</div>
}
}
}

View File

@@ -1,7 +1,7 @@
use yew::prelude::*;
use chrono::{NaiveDate, Datelike};
use crate::components::ViewMode;
use chrono::{Datelike, NaiveDate};
use web_sys::MouseEvent;
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct CalendarHeaderProps {
@@ -18,7 +18,11 @@ pub struct CalendarHeaderProps {
#[function_component(CalendarHeader)]
pub fn calendar_header(props: &CalendarHeaderProps) -> Html {
let title = format!("{} {}", get_month_name(props.current_date.month()), props.current_date.year());
let title = format!(
"{} {}",
get_month_name(props.current_date.month()),
props.current_date.year()
);
html! {
<div class="calendar-header">
@@ -48,7 +52,7 @@ pub fn calendar_header(props: &CalendarHeaderProps) -> Html {
fn get_month_name(month: u32) -> &'static str {
match month {
1 => "January",
2 => "February",
2 => "February",
3 => "March",
4 => "April",
5 => "May",
@@ -59,6 +63,6 @@ fn get_month_name(month: u32) -> &'static str {
10 => "October",
11 => "November",
12 => "December",
_ => "Invalid"
_ => "Invalid",
}
}
}

View File

@@ -1,13 +1,13 @@
use yew::prelude::*;
use web_sys::MouseEvent;
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 on_color_picker_toggle: Callback<String>, // calendar_path
pub available_colors: Vec<String>,
pub on_context_menu: Callback<(MouseEvent, String)>, // (event, calendar_path)
}
@@ -34,7 +34,7 @@ pub fn calendar_list_item(props: &CalendarListItemProps) -> Html {
html! {
<li key={props.calendar.path.clone()} oncontextmenu={on_context_menu}>
<span class="calendar-color"
<span class="calendar-color"
style={format!("background-color: {}", props.calendar.color)}
onclick={on_color_click}>
{
@@ -46,14 +46,14 @@ pub fn calendar_list_item(props: &CalendarListItemProps) -> Html {
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)}
@@ -72,4 +72,4 @@ pub fn calendar_list_item(props: &CalendarListItemProps) -> Html {
<span class="calendar-name">{&props.calendar.display_name}</span>
</li>
}
}
}

View File

@@ -1,5 +1,5 @@
use yew::prelude::*;
use web_sys::MouseEvent;
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct ContextMenuProps {
@@ -13,7 +13,7 @@ pub struct ContextMenuProps {
#[function_component(ContextMenu)]
pub fn context_menu(props: &ContextMenuProps) -> Html {
let menu_ref = use_node_ref();
// Close menu when clicking outside (handled by parent component)
if !props.is_open {
@@ -35,9 +35,9 @@ pub fn context_menu(props: &ContextMenuProps) -> Html {
};
html! {
<div
<div
ref={menu_ref}
class="context-menu"
class="context-menu"
style={style}
>
<div class="context-menu-item context-menu-delete" onclick={on_delete_click}>
@@ -45,4 +45,4 @@ pub fn context_menu(props: &ContextMenuProps) -> Html {
</div>
</div>
}
}
}

View File

@@ -39,30 +39,32 @@ pub fn CreateCalendarModal(props: &CreateCalendarModalProps) -> Html {
let error_message = error_message.clone();
let is_creating = is_creating.clone();
let on_create = props.on_create.clone();
Callback::from(move |e: SubmitEvent| {
e.prevent_default();
let name = (*calendar_name).trim();
if name.is_empty() {
error_message.set(Some("Calendar name is required".to_string()));
return;
}
if name.len() > 100 {
error_message.set(Some("Calendar name too long (max 100 characters)".to_string()));
error_message.set(Some(
"Calendar name too long (max 100 characters)".to_string(),
));
return;
}
error_message.set(None);
is_creating.set(true);
let desc = if (*description).trim().is_empty() {
None
} else {
Some((*description).clone())
};
on_create.emit((name.to_string(), desc, (*selected_color).clone()));
})
};
@@ -90,7 +92,7 @@ pub fn CreateCalendarModal(props: &CreateCalendarModalProps) -> Html {
{"×"}
</button>
</div>
<form class="modal-body" onsubmit={on_submit}>
{
if let Some(ref error) = *error_message {
@@ -103,10 +105,10 @@ pub fn CreateCalendarModal(props: &CreateCalendarModalProps) -> Html {
html! {}
}
}
<div class="form-group">
<label for="calendar-name">{"Calendar Name *"}</label>
<input
<input
id="calendar-name"
type="text"
value={(*calendar_name).clone()}
@@ -116,7 +118,7 @@ pub fn CreateCalendarModal(props: &CreateCalendarModalProps) -> Html {
disabled={*is_creating}
/>
</div>
<div class="form-group">
<label for="calendar-description">{"Description"}</label>
<textarea
@@ -128,7 +130,7 @@ pub fn CreateCalendarModal(props: &CreateCalendarModalProps) -> Html {
disabled={*is_creating}
/>
</div>
<div class="form-group">
<label>{"Calendar Color"}</label>
<div class="color-grid">
@@ -143,13 +145,13 @@ pub fn CreateCalendarModal(props: &CreateCalendarModalProps) -> Html {
selected_color.set(Some(color.clone()));
})
};
let class_name = if is_selected {
"color-option selected"
} else {
"color-option"
let class_name = if is_selected {
"color-option selected"
} else {
"color-option"
};
html! {
<button
key={index}
@@ -165,18 +167,18 @@ pub fn CreateCalendarModal(props: &CreateCalendarModalProps) -> Html {
</div>
<p class="color-help-text">{"Optional: Choose a color for your calendar"}</p>
</div>
<div class="modal-actions">
<button
type="button"
<button
type="button"
class="cancel-button"
onclick={props.on_close.reform(|_| ())}
disabled={*is_creating}
>
{"Cancel"}
</button>
<button
type="submit"
<button
type="submit"
class="create-button"
disabled={*is_creating}
>
@@ -193,4 +195,4 @@ pub fn CreateCalendarModal(props: &CreateCalendarModalProps) -> Html {
</div>
</div>
}
}
}

File diff suppressed because it is too large Load Diff

View File

@@ -1,6 +1,6 @@
use yew::prelude::*;
use web_sys::MouseEvent;
use crate::models::ical::VEvent;
use web_sys::MouseEvent;
use yew::prelude::*;
#[derive(Clone, PartialEq, Debug)]
pub enum DeleteAction {
@@ -30,7 +30,7 @@ pub struct EventContextMenuProps {
#[function_component(EventContextMenu)]
pub fn event_context_menu(props: &EventContextMenuProps) -> Html {
let menu_ref = use_node_ref();
if !props.is_open {
return html! {};
}
@@ -41,7 +41,9 @@ pub fn event_context_menu(props: &EventContextMenuProps) -> Html {
);
// Check if the event is recurring
let is_recurring = props.event.as_ref()
let is_recurring = props
.event
.as_ref()
.map(|event| event.rrule.is_some())
.unwrap_or(false);
@@ -64,9 +66,9 @@ pub fn event_context_menu(props: &EventContextMenuProps) -> Html {
};
html! {
<div
<div
ref={menu_ref}
class="context-menu"
class="context-menu"
style={style}
>
{
@@ -117,4 +119,4 @@ pub fn event_context_menu(props: &EventContextMenuProps) -> Html {
}
</div>
}
}
}

View File

@@ -1,6 +1,6 @@
use yew::prelude::*;
use chrono::{DateTime, Utc};
use crate::models::ical::VEvent;
use chrono::{DateTime, Utc};
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct EventModalProps {
@@ -16,7 +16,7 @@ pub fn EventModal(props: &EventModalProps) -> Html {
on_close.emit(());
})
};
let backdrop_click = {
let on_close = props.on_close.clone();
Callback::from(move |e: MouseEvent| {
@@ -39,7 +39,7 @@ pub fn EventModal(props: &EventModalProps) -> Html {
<strong>{"Title:"}</strong>
<span>{event.get_title()}</span>
</div>
{
if let Some(ref description) = event.description {
html! {
@@ -52,12 +52,12 @@ pub fn EventModal(props: &EventModalProps) -> Html {
html! {}
}
}
<div class="event-detail">
<strong>{"Start:"}</strong>
<span>{format_datetime(&event.dtstart, event.all_day)}</span>
</div>
{
if let Some(ref end) = event.dtend {
html! {
@@ -70,12 +70,12 @@ pub fn EventModal(props: &EventModalProps) -> Html {
html! {}
}
}
<div class="event-detail">
<strong>{"All Day:"}</strong>
<span>{if event.all_day { "Yes" } else { "No" }}</span>
</div>
{
if let Some(ref location) = event.location {
html! {
@@ -88,22 +88,22 @@ pub fn EventModal(props: &EventModalProps) -> Html {
html! {}
}
}
<div class="event-detail">
<strong>{"Status:"}</strong>
<span>{event.get_status_display()}</span>
</div>
<div class="event-detail">
<strong>{"Privacy:"}</strong>
<span>{event.get_class_display()}</span>
</div>
<div class="event-detail">
<strong>{"Priority:"}</strong>
<span>{event.get_priority_display()}</span>
</div>
{
if let Some(ref organizer) = event.organizer {
html! {
@@ -116,7 +116,7 @@ pub fn EventModal(props: &EventModalProps) -> Html {
html! {}
}
}
{
if !event.attendees.is_empty() {
html! {
@@ -129,7 +129,7 @@ pub fn EventModal(props: &EventModalProps) -> Html {
html! {}
}
}
{
if !event.categories.is_empty() {
html! {
@@ -142,7 +142,7 @@ pub fn EventModal(props: &EventModalProps) -> Html {
html! {}
}
}
{
if let Some(ref recurrence) = event.rrule {
html! {
@@ -160,7 +160,7 @@ pub fn EventModal(props: &EventModalProps) -> Html {
}
}
}
{
if !event.alarms.is_empty() {
html! {
@@ -178,7 +178,7 @@ pub fn EventModal(props: &EventModalProps) -> Html {
}
}
}
{
if let Some(ref created) = event.created {
html! {
@@ -191,7 +191,7 @@ pub fn EventModal(props: &EventModalProps) -> Html {
html! {}
}
}
{
if let Some(ref modified) = event.last_modified {
html! {
@@ -236,4 +236,3 @@ fn format_recurrence_rule(rrule: &str) -> String {
format!("Custom ({})", rrule)
}
}

View File

@@ -1,6 +1,6 @@
use yew::prelude::*;
use web_sys::HtmlInputElement;
use gloo_storage::{LocalStorage, Storage};
use web_sys::HtmlInputElement;
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct LoginProps {
@@ -53,7 +53,7 @@ pub fn Login(props: &LoginProps) -> Html {
Callback::from(move |e: SubmitEvent| {
e.prevent_default();
let server_url = (*server_url).clone();
let username = (*username).clone();
let password = (*password).clone();
@@ -77,7 +77,8 @@ pub fn Login(props: &LoginProps) -> Html {
web_sys::console::log_1(&"✅ Login successful!".into());
// Store token and credentials in local storage
if let Err(_) = LocalStorage::set("auth_token", &token) {
error_message.set(Some("Failed to store authentication token".to_string()));
error_message
.set(Some("Failed to store authentication token".to_string()));
is_loading.set(false);
return;
}
@@ -86,7 +87,7 @@ pub fn Login(props: &LoginProps) -> Html {
is_loading.set(false);
return;
}
is_loading.set(false);
on_login.emit(token);
}
@@ -172,21 +173,25 @@ pub fn Login(props: &LoginProps) -> Html {
}
/// Perform login using the CalDAV auth service
async fn perform_login(server_url: String, username: String, password: String) -> Result<(String, String), String> {
async fn perform_login(
server_url: String,
username: String,
password: String,
) -> Result<(String, String), String> {
use crate::auth::{AuthService, CalDAVLoginRequest};
use serde_json;
web_sys::console::log_1(&format!("📡 Creating auth service and request...").into());
let auth_service = AuthService::new();
let request = CalDAVLoginRequest {
server_url: server_url.clone(),
username: username.clone(),
password: password.clone()
let request = CalDAVLoginRequest {
server_url: server_url.clone(),
username: username.clone(),
password: password.clone(),
};
web_sys::console::log_1(&format!("🚀 Sending login request to backend...").into());
match auth_service.login(request).await {
Ok(response) => {
web_sys::console::log_1(&format!("✅ Backend responded successfully").into());
@@ -197,10 +202,10 @@ async fn perform_login(server_url: String, username: String, password: String) -
"password": password
});
Ok((response.token, credentials.to_string()))
},
}
Err(err) => {
web_sys::console::log_1(&format!("❌ Backend error: {}", err).into());
Err(err)
},
}
}
}
}

View File

@@ -1,31 +1,33 @@
pub mod login;
pub mod calendar;
pub mod calendar_header;
pub mod month_view;
pub mod week_view;
pub mod event_modal;
pub mod create_calendar_modal;
pub mod context_menu;
pub mod event_context_menu;
pub mod calendar_context_menu;
pub mod create_event_modal;
pub mod sidebar;
pub mod calendar_header;
pub mod calendar_list_item;
pub mod route_handler;
pub mod context_menu;
pub mod create_calendar_modal;
pub mod create_event_modal;
pub mod event_context_menu;
pub mod event_modal;
pub mod login;
pub mod month_view;
pub mod recurring_edit_modal;
pub mod route_handler;
pub mod sidebar;
pub mod week_view;
pub use login::Login;
pub use calendar::Calendar;
pub use calendar_header::CalendarHeader;
pub use month_view::MonthView;
pub use week_view::WeekView;
pub use event_modal::EventModal;
pub use create_calendar_modal::CreateCalendarModal;
pub use context_menu::ContextMenu;
pub use event_context_menu::{EventContextMenu, DeleteAction, EditAction};
pub use calendar_context_menu::CalendarContextMenu;
pub use create_event_modal::{CreateEventModal, EventCreationData, EventStatus, EventClass, ReminderType, RecurrenceType};
pub use sidebar::{Sidebar, ViewMode, Theme};
pub use calendar_header::CalendarHeader;
pub use calendar_list_item::CalendarListItem;
pub use context_menu::ContextMenu;
pub use create_calendar_modal::CreateCalendarModal;
pub use create_event_modal::{
CreateEventModal, EventClass, EventCreationData, EventStatus, RecurrenceType, ReminderType,
};
pub use event_context_menu::{DeleteAction, EditAction, EventContextMenu};
pub use event_modal::EventModal;
pub use login::Login;
pub use month_view::MonthView;
pub use recurring_edit_modal::{RecurringEditAction, RecurringEditModal};
pub use route_handler::RouteHandler;
pub use recurring_edit_modal::{RecurringEditModal, RecurringEditAction};
pub use sidebar::{Sidebar, Theme, ViewMode};
pub use week_view::WeekView;

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()
}
}
}

View File

@@ -1,6 +1,6 @@
use yew::prelude::*;
use chrono::NaiveDateTime;
use crate::models::ical::VEvent;
use chrono::NaiveDateTime;
use yew::prelude::*;
#[derive(Clone, PartialEq)]
pub enum RecurringEditAction {
@@ -25,29 +25,34 @@ pub fn recurring_edit_modal(props: &RecurringEditModalProps) -> Html {
return html! {};
}
let event_title = props.event.summary.as_ref().map(|s| s.as_str()).unwrap_or("Untitled Event");
let event_title = props
.event
.summary
.as_ref()
.map(|s| s.as_str())
.unwrap_or("Untitled Event");
let on_this_event = {
let on_choice = props.on_choice.clone();
Callback::from(move |_| {
on_choice.emit(RecurringEditAction::ThisEvent);
})
};
let on_future_events = {
let on_choice = props.on_choice.clone();
Callback::from(move |_| {
on_choice.emit(RecurringEditAction::FutureEvents);
})
};
let on_all_events = {
let on_choice = props.on_choice.clone();
Callback::from(move |_| {
on_choice.emit(RecurringEditAction::AllEvents);
})
};
let on_cancel = {
let on_cancel = props.on_cancel.clone();
Callback::from(move |_| {
@@ -64,18 +69,18 @@ pub fn recurring_edit_modal(props: &RecurringEditModalProps) -> Html {
<div class="modal-body">
<p>{format!("You're modifying \"{}\" which is part of a recurring series.", event_title)}</p>
<p>{"How would you like to apply this change?"}</p>
<div class="recurring-edit-options">
<button class="btn btn-primary recurring-option" onclick={on_this_event}>
<div class="option-title">{"This event only"}</div>
<div class="option-description">{"Change only this occurrence"}</div>
</button>
<button class="btn btn-primary recurring-option" onclick={on_future_events}>
<div class="option-title">{"This and future events"}</div>
<div class="option-description">{"Change this occurrence and all future occurrences"}</div>
</button>
<button class="btn btn-primary recurring-option" onclick={on_all_events}>
<div class="option-title">{"All events in series"}</div>
<div class="option-description">{"Change all occurrences in the series"}</div>
@@ -90,4 +95,4 @@ pub fn recurring_edit_modal(props: &RecurringEditModalProps) -> Html {
</div>
</div>
}
}
}

View File

@@ -1,8 +1,8 @@
use crate::components::{Login, ViewMode};
use crate::models::ical::VEvent;
use crate::services::calendar_service::UserInfo;
use yew::prelude::*;
use yew_router::prelude::*;
use crate::components::{Login, ViewMode};
use crate::services::calendar_service::UserInfo;
use crate::models::ical::VEvent;
#[derive(Clone, Routable, PartialEq)]
pub enum Route {
@@ -28,7 +28,17 @@ pub struct RouteHandlerProps {
#[prop_or_default]
pub on_create_event_request: Option<Callback<crate::components::EventCreationData>>,
#[prop_or_default]
pub on_event_update_request: Option<Callback<(VEvent, chrono::NaiveDateTime, chrono::NaiveDateTime, bool, Option<chrono::DateTime<chrono::Utc>>, Option<String>, Option<String>)>>,
pub on_event_update_request: Option<
Callback<(
VEvent,
chrono::NaiveDateTime,
chrono::NaiveDateTime,
bool,
Option<chrono::DateTime<chrono::Utc>>,
Option<String>,
Option<String>,
)>,
>,
#[prop_or_default]
pub context_menus_open: bool,
}
@@ -44,7 +54,7 @@ pub fn route_handler(props: &RouteHandlerProps) -> Html {
let on_create_event_request = props.on_create_event_request.clone();
let on_event_update_request = props.on_event_update_request.clone();
let context_menus_open = props.context_menus_open;
html! {
<Switch<Route> render={move |route| {
let auth_token = auth_token.clone();
@@ -56,7 +66,7 @@ pub fn route_handler(props: &RouteHandlerProps) -> Html {
let on_create_event_request = on_create_event_request.clone();
let on_event_update_request = on_event_update_request.clone();
let context_menus_open = context_menus_open;
match route {
Route::Home => {
if auth_token.is_some() {
@@ -74,16 +84,16 @@ pub fn route_handler(props: &RouteHandlerProps) -> Html {
}
Route::Calendar => {
if auth_token.is_some() {
html! {
<CalendarView
user_info={user_info}
html! {
<CalendarView
user_info={user_info}
on_event_context_menu={on_event_context_menu}
on_calendar_context_menu={on_calendar_context_menu}
view={view}
on_create_event_request={on_create_event_request}
on_event_update_request={on_event_update_request}
context_menus_open={context_menus_open}
/>
/>
}
} else {
html! { <Redirect<Route> to={Route::Login}/> }
@@ -106,192 +116,36 @@ pub struct CalendarViewProps {
#[prop_or_default]
pub on_create_event_request: Option<Callback<crate::components::EventCreationData>>,
#[prop_or_default]
pub on_event_update_request: Option<Callback<(VEvent, chrono::NaiveDateTime, chrono::NaiveDateTime, bool, Option<chrono::DateTime<chrono::Utc>>, Option<String>, Option<String>)>>,
pub on_event_update_request: Option<
Callback<(
VEvent,
chrono::NaiveDateTime,
chrono::NaiveDateTime,
bool,
Option<chrono::DateTime<chrono::Utc>>,
Option<String>,
Option<String>,
)>,
>,
#[prop_or_default]
pub context_menus_open: bool,
}
use gloo_storage::{LocalStorage, Storage};
use crate::services::CalendarService;
use crate::components::Calendar;
use std::collections::HashMap;
use chrono::{Local, NaiveDate, Datelike};
#[function_component(CalendarView)]
pub fn calendar_view(props: &CalendarViewProps) -> Html {
let events = use_state(|| HashMap::<NaiveDate, Vec<VEvent>>::new());
let loading = use_state(|| true);
let error = use_state(|| None::<String>);
let refreshing_event = use_state(|| None::<String>);
let auth_token: Option<String> = LocalStorage::get("auth_token").ok();
let today = Local::now().date_naive();
let current_year = today.year();
let current_month = today.month();
let on_event_click = {
let events = events.clone();
let refreshing_event = refreshing_event.clone();
let auth_token = auth_token.clone();
Callback::from(move |event: VEvent| {
if let Some(token) = auth_token.clone() {
let events = events.clone();
let refreshing_event = refreshing_event.clone();
let uid = event.uid.clone();
refreshing_event.set(Some(uid.clone()));
wasm_bindgen_futures::spawn_local(async move {
let calendar_service = CalendarService::new();
let password = if let Ok(credentials_str) = LocalStorage::get::<String>("caldav_credentials") {
if let Ok(credentials) = serde_json::from_str::<serde_json::Value>(&credentials_str) {
credentials["password"].as_str().unwrap_or("").to_string()
} else {
String::new()
}
} else {
String::new()
};
match calendar_service.refresh_event(&token, &password, &uid).await {
Ok(Some(refreshed_event)) => {
let refreshed_vevent = refreshed_event; // CalendarEvent is now VEvent
let mut updated_events = (*events).clone();
for (_, day_events) in updated_events.iter_mut() {
day_events.retain(|e| e.uid != uid);
}
if refreshed_vevent.rrule.is_some() {
let new_occurrences = CalendarService::expand_recurring_events(vec![refreshed_vevent.clone()]);
for occurrence in new_occurrences {
let date = occurrence.get_date();
updated_events.entry(date)
.or_insert_with(Vec::new)
.push(occurrence);
}
} else {
let date = refreshed_vevent.get_date();
updated_events.entry(date)
.or_insert_with(Vec::new)
.push(refreshed_vevent);
}
events.set(updated_events);
}
Ok(None) => {
let mut updated_events = (*events).clone();
for (_, day_events) in updated_events.iter_mut() {
day_events.retain(|e| e.uid != uid);
}
events.set(updated_events);
}
Err(_err) => {
}
}
refreshing_event.set(None);
});
}
})
};
{
let events = events.clone();
let loading = loading.clone();
let error = error.clone();
let auth_token = auth_token.clone();
use_effect_with((), move |_| {
if let Some(token) = auth_token {
let events = events.clone();
let loading = loading.clone();
let error = error.clone();
wasm_bindgen_futures::spawn_local(async move {
let calendar_service = CalendarService::new();
let password = if let Ok(credentials_str) = LocalStorage::get::<String>("caldav_credentials") {
if let Ok(credentials) = serde_json::from_str::<serde_json::Value>(&credentials_str) {
credentials["password"].as_str().unwrap_or("").to_string()
} else {
String::new()
}
} else {
String::new()
};
match calendar_service.fetch_events_for_month_vevent(&token, &password, current_year, current_month).await {
Ok(vevents) => {
let grouped_events = CalendarService::group_events_by_date(vevents);
events.set(grouped_events);
loading.set(false);
}
Err(err) => {
error.set(Some(format!("Failed to load events: {}", err)));
loading.set(false);
}
}
});
} else {
loading.set(false);
error.set(Some("No authentication token found".to_string()));
}
|| ()
});
}
html! {
<div class="calendar-view">
{
if *loading {
html! {
<div class="calendar-loading">
<p>{"Loading calendar events..."}</p>
</div>
}
} else if let Some(err) = (*error).clone() {
let dummy_callback = Callback::from(|_: VEvent| {});
html! {
<div class="calendar-error">
<p>{format!("Error: {}", err)}</p>
<Calendar
events={HashMap::new()}
on_event_click={dummy_callback}
refreshing_event_uid={(*refreshing_event).clone()}
user_info={props.user_info.clone()}
on_event_context_menu={props.on_event_context_menu.clone()}
on_calendar_context_menu={props.on_calendar_context_menu.clone()}
view={props.view.clone()}
on_create_event_request={props.on_create_event_request.clone()}
on_event_update_request={props.on_event_update_request.clone()}
context_menus_open={props.context_menus_open}
/>
</div>
}
} else {
html! {
<Calendar
events={(*events).clone()}
on_event_click={on_event_click}
refreshing_event_uid={(*refreshing_event).clone()}
user_info={props.user_info.clone()}
on_event_context_menu={props.on_event_context_menu.clone()}
on_calendar_context_menu={props.on_calendar_context_menu.clone()}
view={props.view.clone()}
on_create_event_request={props.on_create_event_request.clone()}
on_event_update_request={props.on_event_update_request.clone()}
context_menus_open={props.context_menus_open}
/>
}
}
}
<Calendar
user_info={props.user_info.clone()}
on_event_context_menu={props.on_event_context_menu.clone()}
on_calendar_context_menu={props.on_calendar_context_menu.clone()}
view={props.view.clone()}
on_create_event_request={props.on_create_event_request.clone()}
on_event_update_request={props.on_event_update_request.clone()}
context_menus_open={props.context_menus_open}
/>
</div>
}
}
}

View File

@@ -1,8 +1,8 @@
use crate::components::CalendarListItem;
use crate::services::calendar_service::UserInfo;
use web_sys::HtmlSelectElement;
use yew::prelude::*;
use yew_router::prelude::*;
use web_sys::HtmlSelectElement;
use crate::services::calendar_service::UserInfo;
use crate::components::CalendarListItem;
#[derive(Clone, Routable, PartialEq)]
pub enum Route {
@@ -33,12 +33,11 @@ pub enum Theme {
}
impl Theme {
pub fn value(&self) -> &'static str {
match self {
Theme::Default => "default",
Theme::Ocean => "ocean",
Theme::Forest => "forest",
Theme::Forest => "forest",
Theme::Sunset => "sunset",
Theme::Purple => "purple",
Theme::Dark => "dark",
@@ -46,7 +45,7 @@ impl Theme {
Theme::Mint => "mint",
}
}
pub fn from_value(value: &str) -> Self {
match value {
"ocean" => Theme::Ocean,
@@ -167,14 +166,14 @@ pub fn sidebar(props: &SidebarProps) -> Html {
<button onclick={props.on_create_calendar.reform(|_| ())} class="create-calendar-button">
{"+ Create Calendar"}
</button>
<div class="view-selector">
<select class="view-selector-dropdown" onchange={on_view_change}>
<option value="month" selected={matches!(props.current_view, ViewMode::Month)}>{"Month"}</option>
<option value="week" selected={matches!(props.current_view, ViewMode::Week)}>{"Week"}</option>
</select>
</div>
<div class="theme-selector">
<select class="theme-selector-dropdown" onchange={on_theme_change}>
<option value="default" selected={matches!(props.current_theme, Theme::Default)}>{"Default"}</option>
@@ -187,9 +186,9 @@ pub fn sidebar(props: &SidebarProps) -> Html {
<option value="mint" selected={matches!(props.current_theme, Theme::Mint)}>{"Mint"}</option>
</select>
</div>
<button onclick={props.on_logout.reform(|_| ())} class="logout-button">{"Logout"}</button>
</div>
</aside>
}
}
}

View File

@@ -1,10 +1,10 @@
use yew::prelude::*;
use chrono::{Datelike, NaiveDate, Duration, Weekday, Local, Timelike, NaiveDateTime, NaiveTime};
use crate::components::{EventCreationData, RecurringEditAction, RecurringEditModal};
use crate::models::ical::VEvent;
use crate::services::calendar_service::UserInfo;
use chrono::{Datelike, Duration, Local, NaiveDate, NaiveDateTime, NaiveTime, Timelike, Weekday};
use std::collections::HashMap;
use web_sys::MouseEvent;
use crate::services::calendar_service::UserInfo;
use crate::models::ical::VEvent;
use crate::components::{RecurringEditModal, RecurringEditAction, EventCreationData};
use yew::prelude::*;
#[derive(Properties, PartialEq)]
pub struct WeekViewProps {
@@ -25,7 +25,17 @@ pub struct WeekViewProps {
#[prop_or_default]
pub on_create_event_request: Option<Callback<EventCreationData>>,
#[prop_or_default]
pub on_event_update: Option<Callback<(VEvent, NaiveDateTime, NaiveDateTime, bool, Option<chrono::DateTime<chrono::Utc>>, Option<String>, Option<String>)>>,
pub on_event_update: Option<
Callback<(
VEvent,
NaiveDateTime,
NaiveDateTime,
bool,
Option<chrono::DateTime<chrono::Utc>>,
Option<String>,
Option<String>,
)>,
>,
#[prop_or_default]
pub context_menus_open: bool,
#[prop_or_default]
@@ -47,20 +57,18 @@ struct DragState {
start_date: NaiveDate,
start_y: f64,
current_y: f64,
offset_y: f64, // For event moves, this is the offset from the event's top
offset_y: f64, // For event moves, this is the offset from the event's top
has_moved: bool, // Track if we've moved enough to constitute a real drag
}
#[function_component(WeekView)]
pub fn week_view(props: &WeekViewProps) -> Html {
let start_of_week = get_start_of_week(props.current_date);
let week_days: Vec<NaiveDate> = (0..7)
.map(|i| start_of_week + Duration::days(i))
.collect();
let week_days: Vec<NaiveDate> = (0..7).map(|i| start_of_week + Duration::days(i)).collect();
// Drag state for event creation
let drag_state = use_state(|| None::<DragState>);
// State for recurring event edit modal
#[derive(Clone, PartialEq)]
struct PendingRecurringEdit {
@@ -68,15 +76,18 @@ pub fn week_view(props: &WeekViewProps) -> Html {
new_start: NaiveDateTime,
new_end: NaiveDateTime,
}
let pending_recurring_edit = use_state(|| None::<PendingRecurringEdit>);
// Helper function to get calendar color for an event
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();
}
}
@@ -85,21 +96,22 @@ pub fn week_view(props: &WeekViewProps) -> Html {
};
// Generate time labels - 24 hours plus the final midnight boundary
let mut time_labels: Vec<String> = (0..24).map(|hour| {
if hour == 0 {
"12 AM".to_string()
} else if hour < 12 {
format!("{} AM", hour)
} else if hour == 12 {
"12 PM".to_string()
} else {
format!("{} PM", hour - 12)
}
}).collect();
let mut time_labels: Vec<String> = (0..24)
.map(|hour| {
if hour == 0 {
"12 AM".to_string()
} else if hour < 12 {
format!("{} AM", hour)
} else if hour == 12 {
"12 PM".to_string()
} else {
format!("{} PM", hour - 12)
}
})
.collect();
// Add the final midnight boundary to show where the day ends
time_labels.push("12 AM".to_string());
// Handlers for recurring event modification modal
let on_recurring_choice = {
@@ -135,35 +147,35 @@ pub fn week_view(props: &WeekViewProps) -> Html {
if let Some(update_callback) = &on_event_update {
// Extract occurrence date for backend processing
let occurrence_date = edit.event.dtstart.format("%Y-%m-%d").to_string();
// Send single request to backend with "this_only" scope
// Backend will atomically:
// 1. Add EXDATE to original series (excludes this occurrence)
// 2. Create exception event with RECURRENCE-ID and user's modifications
update_callback.emit((
edit.event.clone(), // Original event (series to modify)
edit.new_start, // Dragged start time for exception
edit.new_end, // Dragged end time for exception
true, // preserve_rrule = true
None, // No until_date for this_only
edit.event.clone(), // Original event (series to modify)
edit.new_start, // Dragged start time for exception
edit.new_end, // Dragged end time for exception
true, // preserve_rrule = true
None, // No until_date for this_only
Some("this_only".to_string()), // Update scope
Some(occurrence_date) // Date of occurrence being modified
Some(occurrence_date), // Date of occurrence being modified
));
}
},
}
RecurringEditAction::FutureEvents => {
// RFC 5545 Compliant Series Splitting: "This and Future Events"
//
//
// When a user chooses to modify "this and future events" for a recurring series,
// we implement a series split operation that:
//
// 1. **Terminates Original Series**: The existing series is updated with an UNTIL
//
// 1. **Terminates Original Series**: The existing series is updated with an UNTIL
// clause to stop before the occurrence being modified
// 2. **Creates New Series**: A new recurring series is created starting from the
// 2. **Creates New Series**: A new recurring series is created starting from the
// occurrence date with the user's modifications (new time, title, etc.)
//
// Example: User drags Aug 22 occurrence of "Daily 9AM meeting" to 2PM:
// - Original: "Daily 9AM meeting" → ends Aug 21 (UNTIL=Aug22T000000Z)
// - Original: "Daily 9AM meeting" → ends Aug 21 (UNTIL=Aug22T000000Z)
// - New: "Daily 2PM meeting" → starts Aug 22, continues indefinitely
//
// This approach ensures:
@@ -177,7 +189,8 @@ pub fn week_view(props: &WeekViewProps) -> Html {
if let Some(update_callback) = &on_event_update {
// Find the original series event (not the occurrence)
// UIDs like "uuid-timestamp" need to split on the last hyphen, not the first
let base_uid = if let Some(last_hyphen_pos) = edit.event.uid.rfind('-') {
let base_uid = if let Some(last_hyphen_pos) = edit.event.uid.rfind('-')
{
let suffix = &edit.event.uid[last_hyphen_pos + 1..];
// Check if suffix is numeric (timestamp), if so remove it
if suffix.chars().all(|c| c.is_numeric()) {
@@ -188,9 +201,15 @@ pub fn week_view(props: &WeekViewProps) -> Html {
} else {
edit.event.uid.clone()
};
web_sys::console::log_1(&format!("🔍 Looking for original series: '{}' from occurrence: '{}'", base_uid, edit.event.uid).into());
web_sys::console::log_1(
&format!(
"🔍 Looking for original series: '{}' from occurrence: '{}'",
base_uid, edit.event.uid
)
.into(),
);
// Find the original series event by searching for the base UID
let mut original_series = None;
for events_list in events.values() {
@@ -204,12 +223,15 @@ pub fn week_view(props: &WeekViewProps) -> Html {
break;
}
}
let original_series = match original_series {
Some(series) => {
web_sys::console::log_1(&format!("✅ Found original series: '{}'", series.uid).into());
web_sys::console::log_1(
&format!("✅ Found original series: '{}'", series.uid)
.into(),
);
series
},
}
None => {
web_sys::console::log_1(&format!("⚠️ Could not find original series '{}', using occurrence but fixing UID", base_uid).into());
let mut fallback_event = edit.event.clone();
@@ -218,55 +240,69 @@ pub fn week_view(props: &WeekViewProps) -> Html {
fallback_event
}
};
// Calculate the day before this occurrence for UNTIL clause
let until_date = edit.event.dtstart.date_naive() - chrono::Duration::days(1);
let until_datetime = until_date.and_time(chrono::NaiveTime::from_hms_opt(23, 59, 59).unwrap());
let until_utc = chrono::DateTime::<chrono::Utc>::from_naive_utc_and_offset(until_datetime, chrono::Utc);
let until_date =
edit.event.dtstart.date_naive() - chrono::Duration::days(1);
let until_datetime = until_date
.and_time(chrono::NaiveTime::from_hms_opt(23, 59, 59).unwrap());
let until_utc =
chrono::DateTime::<chrono::Utc>::from_naive_utc_and_offset(
until_datetime,
chrono::Utc,
);
web_sys::console::log_1(&format!("🔄 Will set UNTIL {} for original series to end before occurrence {}",
until_utc.format("%Y-%m-%d %H:%M:%S UTC"),
edit.event.dtstart.format("%Y-%m-%d %H:%M:%S UTC")).into());
// Critical: Use the dragged times (new_start/new_end) not the original series times
// This ensures the new series reflects the user's drag operation
let new_start = edit.new_start; // The dragged start time
let new_start = edit.new_start; // The dragged start time
let new_end = edit.new_end; // The dragged end time
// Extract occurrence date from the dragged event for backend processing
// Format: YYYY-MM-DD (e.g., "2025-08-22")
// This tells the backend which specific occurrence is being modified
let occurrence_date = edit.event.dtstart.format("%Y-%m-%d").to_string();
// Send single request to backend with "this_and_future" scope
// Backend will atomically:
// 1. Add UNTIL clause to original series (stops before occurrence_date)
// 2. Create new series starting from occurrence_date with dragged times
update_callback.emit((
original_series, // Original event to terminate
new_start, // Dragged start time for new series
new_end, // Dragged end time for new series
true, // preserve_rrule = true
Some(until_utc), // UNTIL date for original series
original_series, // Original event to terminate
new_start, // Dragged start time for new series
new_end, // Dragged end time for new series
true, // preserve_rrule = true
Some(until_utc), // UNTIL date for original series
Some("this_and_future".to_string()), // Update scope
Some(occurrence_date) // Date of occurrence being modified
Some(occurrence_date), // Date of occurrence being modified
));
}
},
}
RecurringEditAction::AllEvents => {
// Modify the entire series
let series_event = edit.event.clone();
if let Some(callback) = &on_event_update {
callback.emit((series_event, edit.new_start, edit.new_end, true, None, Some("all_in_series".to_string()), None)); // Regular drag operation - preserve RRULE, update_scope = all_in_series
callback.emit((
series_event,
edit.new_start,
edit.new_end,
true,
None,
Some("all_in_series".to_string()),
None,
)); // Regular drag operation - preserve RRULE, update_scope = all_in_series
}
},
}
}
}
pending_recurring_edit.set(None);
})
};
let on_recurring_cancel = {
let pending_recurring_edit = pending_recurring_edit.clone();
Callback::from(move |_| {
@@ -283,7 +319,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
week_days.iter().map(|date| {
let is_today = *date == props.today;
let weekday_name = get_weekday_name(date.weekday());
html! {
<div class={classes!("week-day-header", if is_today { Some("today") } else { None })}>
<div class="weekday-name">{weekday_name}</div>
@@ -293,7 +329,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
}).collect::<Html>()
}
</div>
// Scrollable content area with time grid
<div class="week-content">
<div class="time-grid">
@@ -310,18 +346,18 @@ pub fn week_view(props: &WeekViewProps) -> Html {
}).collect::<Html>()
}
</div>
// Day columns
<div class="week-days-grid">
{
week_days.iter().enumerate().map(|(_column_index, date)| {
let is_today = *date == props.today;
let day_events = props.events.get(date).cloned().unwrap_or_default();
// Drag event handlers
let drag_state_clone = drag_state.clone();
let date_for_drag = *date;
let onmousedown = {
let drag_state = drag_state_clone.clone();
let context_menus_open = props.context_menus_open;
@@ -331,20 +367,20 @@ pub fn week_view(props: &WeekViewProps) -> Html {
if context_menus_open {
return;
}
// Only handle left-click (button 0)
if e.button() != 0 {
return;
}
// Calculate Y position relative to day column container
// Use layer_y which gives coordinates relative to positioned ancestor
let relative_y = e.layer_y() as f64;
let relative_y = if relative_y > 0.0 { relative_y } else { e.offset_y() as f64 };
// Snap to increment
let snapped_y = snap_to_increment(relative_y, time_increment);
drag_state.set(Some(DragState {
is_dragging: true,
drag_type: DragType::CreateEvent,
@@ -357,7 +393,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
e.prevent_default();
})
};
let onmousemove = {
let drag_state = drag_state_clone.clone();
let time_increment = props.time_increment;
@@ -367,27 +403,27 @@ pub fn week_view(props: &WeekViewProps) -> Html {
// Use layer_y for consistent coordinate calculation
let mouse_y = e.layer_y() as f64;
let mouse_y = if mouse_y > 0.0 { mouse_y } else { e.offset_y() as f64 };
// For move operations, we now follow the mouse directly since we start at click position
// For resize operations, we still use the mouse position directly
let adjusted_y = mouse_y;
// Snap to increment
let snapped_y = snap_to_increment(adjusted_y, time_increment);
// Check if we've moved enough to constitute a real drag (5 pixels minimum)
let movement_distance = (snapped_y - current_drag.start_y).abs();
if movement_distance > 5.0 {
current_drag.has_moved = true;
}
current_drag.current_y = snapped_y;
drag_state.set(Some(current_drag));
}
}
})
};
let onmouseup = {
let drag_state = drag_state_clone.clone();
let on_create_event = props.on_create_event.clone();
@@ -402,24 +438,24 @@ pub fn week_view(props: &WeekViewProps) -> Html {
// Calculate start and end times
let start_time = pixels_to_time(current_drag.start_y);
let end_time = pixels_to_time(current_drag.current_y);
// Ensure start is before end
let (actual_start, actual_end) = if start_time <= end_time {
(start_time, end_time)
} else {
(end_time, start_time)
};
// Ensure minimum duration (15 minutes)
let actual_end = if actual_end.signed_duration_since(actual_start).num_minutes() < 15 {
actual_start + chrono::Duration::minutes(15)
} else {
actual_end
};
let start_datetime = NaiveDateTime::new(current_drag.start_date, actual_start);
let end_datetime = NaiveDateTime::new(current_drag.start_date, actual_end);
if let Some(callback) = &on_create_event {
callback.emit((current_drag.start_date, start_datetime, end_datetime));
}
@@ -430,17 +466,17 @@ pub fn week_view(props: &WeekViewProps) -> Html {
// Snap the final position to maintain time increment alignment
let event_top_position = snap_to_increment(unsnapped_position, time_increment);
let new_start_time = pixels_to_time(event_top_position);
// Calculate duration from original event
let original_duration = if let Some(end) = event.dtend {
end.signed_duration_since(event.dtstart)
} else {
chrono::Duration::hours(1) // Default 1 hour
};
let new_start_datetime = NaiveDateTime::new(current_drag.start_date, new_start_time);
let new_end_datetime = new_start_datetime + original_duration;
// Check if this is a recurring event
if event.rrule.is_some() {
// Show modal for recurring event modification
@@ -459,7 +495,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
DragType::ResizeEventStart(event) => {
// Calculate new start time based on drag position
let new_start_time = pixels_to_time(current_drag.current_y);
// Keep the original end time
let original_end = if let Some(end) = event.dtend {
end.with_timezone(&chrono::Local).naive_local()
@@ -467,16 +503,16 @@ pub fn week_view(props: &WeekViewProps) -> Html {
// If no end time, use start time + 1 hour as default
event.dtstart.with_timezone(&chrono::Local).naive_local() + chrono::Duration::hours(1)
};
let new_start_datetime = NaiveDateTime::new(current_drag.start_date, new_start_time);
// Ensure start is before end (minimum 15 minutes)
let new_end_datetime = if new_start_datetime >= original_end {
new_start_datetime + chrono::Duration::minutes(15)
} else {
original_end
};
// Check if this is a recurring event
if event.rrule.is_some() {
// Show modal for recurring event modification
@@ -495,19 +531,19 @@ pub fn week_view(props: &WeekViewProps) -> Html {
DragType::ResizeEventEnd(event) => {
// Calculate new end time based on drag position
let new_end_time = pixels_to_time(current_drag.current_y);
// Keep the original start time
let original_start = event.dtstart.with_timezone(&chrono::Local).naive_local();
let new_end_datetime = NaiveDateTime::new(current_drag.start_date, new_end_time);
// Ensure end is after start (minimum 15 minutes)
let new_start_datetime = if new_end_datetime <= original_start {
new_end_datetime - chrono::Duration::minutes(15)
} else {
original_start
};
// Check if this is a recurring event
if event.rrule.is_some() {
// Show modal for recurring event modification
@@ -524,15 +560,15 @@ pub fn week_view(props: &WeekViewProps) -> Html {
}
}
}
drag_state.set(None);
}
}
})
};
html! {
<div
<div
class={classes!("week-day-column", if is_today { Some("today") } else { None })}
{onmousedown}
{onmousemove}
@@ -554,21 +590,21 @@ pub fn week_view(props: &WeekViewProps) -> Html {
<div class="time-slot-half"></div>
<div class="time-slot-half"></div>
</div>
// Events positioned absolutely based on their actual times
<div class="events-container">
{
day_events.iter().filter_map(|event| {
let (start_pixels, duration_pixels, is_all_day) = calculate_event_position(event, *date);
// Skip events that don't belong on this date or have invalid positioning
if start_pixels == 0.0 && duration_pixels == 0.0 && !is_all_day {
return None;
}
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();
@@ -577,7 +613,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
on_event_click.emit(event.clone());
})
};
let onmousedown_event = {
let drag_state = drag_state.clone();
let event_for_drag = event.clone();
@@ -585,27 +621,27 @@ pub fn week_view(props: &WeekViewProps) -> Html {
let _time_increment = props.time_increment;
Callback::from(move |e: MouseEvent| {
e.stop_propagation(); // Prevent drag-to-create from starting on event clicks
// Only handle left-click (button 0) for moving
if e.button() != 0 {
return;
}
// Calculate click position relative to event element
let click_y_relative = e.layer_y() as f64;
let click_y_relative = if click_y_relative > 0.0 { click_y_relative } else { e.offset_y() as f64 };
// Get event's current position in day column coordinates
let (event_start_pixels, _, _) = calculate_event_position(&event_for_drag, date_for_drag);
let event_start_pixels = event_start_pixels as f64;
// Convert click position to day column coordinates
let click_y = event_start_pixels + click_y_relative;
// Store the offset from the event's top where the user clicked
// This will be used to maintain the relative click position
let offset_y = click_y_relative;
// Start drag tracking from where we clicked (in day column coordinates)
drag_state.set(Some(DragState {
is_dragging: true,
@@ -619,7 +655,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
e.prevent_default();
})
};
let oncontextmenu = {
if let Some(callback) = &props.on_event_context_menu {
let callback = callback.clone();
@@ -633,7 +669,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
return;
}
}
e.prevent_default();
e.stop_propagation(); // Prevent calendar context menu from also triggering
callback.emit((e, event.clone()));
@@ -642,7 +678,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
None
}
};
// Format time display for the event
let time_display = if event.all_day {
"All Day".to_string()
@@ -650,20 +686,20 @@ pub fn week_view(props: &WeekViewProps) -> Html {
let local_start = event.dtstart.with_timezone(&Local);
if let Some(end) = event.dtend {
let local_end = end.with_timezone(&Local);
// Check if both times are in same AM/PM period to avoid redundancy
let start_is_am = local_start.hour() < 12;
let end_is_am = local_end.hour() < 12;
if start_is_am == end_is_am {
// Same AM/PM period - show "9:00 - 10:30 AM"
format!("{} - {}",
format!("{} - {}",
local_start.format("%I:%M").to_string().trim_start_matches('0'),
local_end.format("%I:%M %p")
)
} else {
// Different AM/PM periods - show "9:00 AM - 2:30 PM"
format!("{} - {}",
format!("{} - {}",
local_start.format("%I:%M %p"),
local_end.format("%I:%M %p")
)
@@ -673,22 +709,22 @@ pub fn week_view(props: &WeekViewProps) -> Html {
format!("{}", local_start.format("%I:%M %p"))
}
};
// Check if this event is currently being dragged or resized
let is_being_dragged = if let Some(drag) = (*drag_state).clone() {
match &drag.drag_type {
DragType::MoveEvent(dragged_event) =>
DragType::MoveEvent(dragged_event) =>
dragged_event.uid == event.uid && drag.is_dragging,
DragType::ResizeEventStart(dragged_event) =>
DragType::ResizeEventStart(dragged_event) =>
dragged_event.uid == event.uid && drag.is_dragging,
DragType::ResizeEventEnd(dragged_event) =>
DragType::ResizeEventEnd(dragged_event) =>
dragged_event.uid == event.uid && drag.is_dragging,
_ => false,
}
} else {
false
};
if is_being_dragged {
// Hide the original event while being dragged
Some(html! {})
@@ -701,11 +737,11 @@ pub fn week_view(props: &WeekViewProps) -> Html {
let time_increment = props.time_increment;
Callback::from(move |e: web_sys::MouseEvent| {
e.stop_propagation();
let relative_y = e.layer_y() as f64;
let relative_y = if relative_y > 0.0 { relative_y } else { e.offset_y() as f64 };
let snapped_y = snap_to_increment(relative_y, time_increment);
drag_state.set(Some(DragState {
is_dragging: true,
drag_type: DragType::ResizeEventStart(event_for_resize.clone()),
@@ -718,7 +754,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
e.prevent_default();
})
};
let resize_end_handler = {
let drag_state = drag_state.clone();
let event_for_resize = event.clone();
@@ -726,11 +762,11 @@ pub fn week_view(props: &WeekViewProps) -> Html {
let time_increment = props.time_increment;
Callback::from(move |e: web_sys::MouseEvent| {
e.stop_propagation();
let relative_y = e.layer_y() as f64;
let relative_y = if relative_y > 0.0 { relative_y } else { e.offset_y() as f64 };
let snapped_y = snap_to_increment(relative_y, time_increment);
drag_state.set(Some(DragState {
is_dragging: true,
drag_type: DragType::ResizeEventEnd(event_for_resize.clone()),
@@ -743,18 +779,18 @@ pub fn week_view(props: &WeekViewProps) -> Html {
e.prevent_default();
})
};
Some(html! {
<div
<div
class={classes!(
"week-event",
"week-event",
if is_refreshing { Some("refreshing") } else { None },
if is_all_day { Some("all-day") } else { None }
)}
style={format!(
"background-color: {}; top: {}px; height: {}px;",
event_color,
start_pixels,
"background-color: {}; top: {}px; height: {}px;",
event_color,
start_pixels,
duration_pixels
)}
{onclick}
@@ -764,7 +800,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
// Top resize handle
{if !is_all_day {
html! {
<div
<div
class="resize-handle resize-handle-top"
onmousedown={resize_start_handler}
/>
@@ -772,7 +808,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
} else {
html! {}
}}
// Event content
<div class="event-content">
<div class="event-title">{event.summary.as_ref().unwrap_or(&"Untitled".to_string())}</div>
@@ -782,11 +818,11 @@ pub fn week_view(props: &WeekViewProps) -> Html {
html! {}
}}
</div>
// Bottom resize handle
{if !is_all_day {
html! {
<div
<div
class="resize-handle resize-handle-bottom"
onmousedown={resize_end_handler}
/>
@@ -800,7 +836,7 @@ pub fn week_view(props: &WeekViewProps) -> Html {
}).collect::<Html>()
}
</div>
// Temporary event box during drag
{
if let Some(drag) = (*drag_state).clone() {
@@ -810,11 +846,11 @@ pub fn week_view(props: &WeekViewProps) -> Html {
let start_y = drag.start_y.min(drag.current_y);
let end_y = drag.start_y.max(drag.current_y);
let height = (drag.current_y - drag.start_y).abs().max(20.0);
// Convert pixels to times for display
let start_time = pixels_to_time(start_y);
let end_time = pixels_to_time(end_y);
html! {
<div
class="temp-event-box"
@@ -837,9 +873,9 @@ pub fn week_view(props: &WeekViewProps) -> Html {
};
let duration_pixels = (original_duration.num_minutes() as f64).max(20.0);
let new_end_time = new_start_time + original_duration;
let event_color = get_event_color(event);
html! {
<div
class="temp-event-box moving-event"
@@ -858,17 +894,17 @@ pub fn week_view(props: &WeekViewProps) -> Html {
} else {
event.dtstart.with_timezone(&chrono::Local).naive_local() + chrono::Duration::hours(1)
};
// Calculate positions for the preview
let (original_start_pixels, _, _) = calculate_event_position(event, drag.start_date);
let original_duration = original_end.signed_duration_since(event.dtstart.with_timezone(&chrono::Local).naive_local());
let original_end_pixels = original_start_pixels + (original_duration.num_minutes() as f32);
let new_start_pixels = drag.current_y;
let new_height = (original_end_pixels as f64 - new_start_pixels).max(20.0);
let event_color = get_event_color(event);
html! {
<div
class="temp-event-box resizing-event"
@@ -883,15 +919,15 @@ pub fn week_view(props: &WeekViewProps) -> Html {
// Show the event being resized from the end
let new_end_time = pixels_to_time(drag.current_y);
let original_start = event.dtstart.with_timezone(&chrono::Local).naive_local();
// Calculate positions for the preview
let (original_start_pixels, _, _) = calculate_event_position(event, drag.start_date);
let new_end_pixels = drag.current_y;
let new_height = (new_end_pixels - original_start_pixels as f64).max(20.0);
let event_color = get_event_color(event);
html! {
<div
class="temp-event-box resizing-event"
@@ -917,10 +953,10 @@ pub fn week_view(props: &WeekViewProps) -> Html {
</div>
</div>
</div>
// Recurring event modification modal
if let Some(edit) = (*pending_recurring_edit).clone() {
<RecurringEditModal
<RecurringEditModal
show={true}
event={edit.event}
new_start={edit.new_start}
@@ -975,46 +1011,44 @@ fn pixels_to_time(pixels: f64) -> NaiveTime {
let total_minutes = pixels; // 1px = 1 minute
let hours = (total_minutes / 60.0) as u32;
let minutes = (total_minutes % 60.0) as u32;
// Handle midnight boundary - if we're at exactly 1440 pixels (24:00), return midnight
if total_minutes >= 1440.0 {
return NaiveTime::from_hms_opt(0, 0, 0).unwrap();
}
// Clamp to valid time range for within-day times
let hours = hours.min(23);
let minutes = minutes.min(59);
NaiveTime::from_hms_opt(hours, minutes, 0).unwrap_or(NaiveTime::from_hms_opt(0, 0, 0).unwrap())
}
fn calculate_event_position(event: &VEvent, date: NaiveDate) -> (f32, f32, bool) {
// Convert UTC times to local time for display
let local_start = event.dtstart.with_timezone(&Local);
let event_date = local_start.date_naive();
// Only position events that are on this specific date
if event_date != date {
return (0.0, 0.0, false); // Event not on this date
}
// Handle all-day events - they appear at the top
if event.all_day {
return (0.0, 30.0, true); // Position at top, 30px height, is_all_day = true
}
// Calculate start position in pixels from midnight
let start_hour = local_start.hour() as f32;
let start_minute = local_start.minute() as f32;
let start_pixels = (start_hour + start_minute / 60.0) * 60.0; // 60px per hour
// Calculate duration and height
let duration_pixels = if let Some(end) = event.dtend {
let local_end = end.with_timezone(&Local);
let end_date = local_end.date_naive();
// Handle events that span multiple days by capping at midnight
if end_date > date {
// Event continues past midnight, cap at 24:00 (1440px)
@@ -1028,6 +1062,6 @@ fn calculate_event_position(event: &VEvent, date: NaiveDate) -> (f32, f32, bool)
} else {
60.0 // Default 1 hour if no end time
};
(start_pixels, duration_pixels, false) // is_all_day = false
}
}

View File

@@ -1,4 +1,3 @@
mod app;
mod auth;
mod components;
@@ -9,4 +8,4 @@ use app::App;
fn main() {
yew::Renderer::<App>::new().render();
}
}

View File

@@ -1,2 +1,2 @@
// Re-export from shared calendar-models library for backward compatibility
pub use calendar_models::*;
pub use calendar_models::*;

View File

@@ -1,5 +1,5 @@
// RFC 5545 Compliant iCalendar Models
pub mod ical;
// Re-export commonly used types
// pub use ical::VEvent;
// Re-export commonly used types
// pub use ical::VEvent;

File diff suppressed because it is too large Load Diff

View File

@@ -1,3 +1,3 @@
pub mod calendar_service;
pub use calendar_service::CalendarService;
pub use calendar_service::CalendarService;