Implement tabbed calendar management modal with improved styling
- Replace separate Create Calendar and External Calendar modals with unified tabbed interface - Redesign modal styling with less rounded corners and cleaner appearance - Significantly increase padding throughout modal components for better spacing - Fix CSS variable self-references (control-padding, standard-transition) - Improve button styling with better padding (0.875rem 2rem) and colors - Enhance form elements with generous padding (1rem) and improved focus states - Redesign tab bar with segmented control appearance and proper active states - Update context menus with modern glassmorphism styling and smooth animations - Consolidate calendar management functionality into single reusable component 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Connor Johnstone
@@ -1,6 +1,6 @@
|
||||
use crate::components::{
|
||||
CalendarContextMenu, ContextMenu, CreateCalendarModal, CreateEventModal, DeleteAction,
|
||||
EditAction, EventContextMenu, EventModal, EventCreationData, ExternalCalendarModal,
|
||||
CalendarContextMenu, CalendarManagementModal, ContextMenu, CreateEventModal, DeleteAction,
|
||||
EditAction, EventContextMenu, EventModal, EventCreationData,
|
||||
MobileWarningModal, RouteHandler, Sidebar, Theme, ViewMode,
|
||||
};
|
||||
use crate::components::mobile_warning_modal::is_mobile_device;
|
||||
@@ -95,7 +95,7 @@ pub fn App() -> Html {
|
||||
|
||||
let user_info = use_state(|| -> Option<UserInfo> { None });
|
||||
let color_picker_open = use_state(|| -> Option<String> { None });
|
||||
let create_modal_open = use_state(|| false);
|
||||
let calendar_management_modal_open = use_state(|| false);
|
||||
let context_menu_open = use_state(|| false);
|
||||
let context_menu_pos = use_state(|| (0i32, 0i32));
|
||||
let context_menu_calendar_path = use_state(|| -> Option<String> { None });
|
||||
@@ -121,7 +121,6 @@ pub fn App() -> Html {
|
||||
|
||||
// Mobile warning state
|
||||
let mobile_warning_open = use_state(|| is_mobile_device());
|
||||
let external_calendar_modal_open = use_state(|| false);
|
||||
let refresh_interval = use_state(|| -> Option<Interval> { None });
|
||||
|
||||
// Calendar view state - load from localStorage if available
|
||||
@@ -1168,13 +1167,9 @@ pub fn App() -> Html {
|
||||
<Sidebar
|
||||
user_info={(*user_info).clone()}
|
||||
on_logout={on_logout}
|
||||
on_create_calendar={Callback::from({
|
||||
let create_modal_open = create_modal_open.clone();
|
||||
move |_| create_modal_open.set(true)
|
||||
})}
|
||||
on_create_external_calendar={Callback::from({
|
||||
let external_calendar_modal_open = external_calendar_modal_open.clone();
|
||||
move |_| external_calendar_modal_open.set(true)
|
||||
on_add_calendar={Callback::from({
|
||||
let calendar_management_modal_open = calendar_management_modal_open.clone();
|
||||
move |_| calendar_management_modal_open.set(true)
|
||||
})}
|
||||
external_calendars={(*external_calendars).clone()}
|
||||
on_external_calendar_toggle={Callback::from({
|
||||
@@ -1386,20 +1381,20 @@ pub fn App() -> Html {
|
||||
}
|
||||
}
|
||||
|
||||
<CreateCalendarModal
|
||||
is_open={*create_modal_open}
|
||||
<CalendarManagementModal
|
||||
is_open={*calendar_management_modal_open}
|
||||
on_close={Callback::from({
|
||||
let create_modal_open = create_modal_open.clone();
|
||||
move |_| create_modal_open.set(false)
|
||||
let calendar_management_modal_open = calendar_management_modal_open.clone();
|
||||
move |_| calendar_management_modal_open.set(false)
|
||||
})}
|
||||
on_create={Callback::from({
|
||||
on_create_calendar={Callback::from({
|
||||
let auth_token = auth_token.clone();
|
||||
let refresh_calendars = refresh_calendars.clone();
|
||||
let create_modal_open = create_modal_open.clone();
|
||||
let calendar_management_modal_open = calendar_management_modal_open.clone();
|
||||
move |(name, description, color): (String, Option<String>, Option<String>)| {
|
||||
if let Some(token) = (*auth_token).clone() {
|
||||
let refresh_calendars = refresh_calendars.clone();
|
||||
let create_modal_open = create_modal_open.clone();
|
||||
let calendar_management_modal_open = calendar_management_modal_open.clone();
|
||||
|
||||
wasm_bindgen_futures::spawn_local(async move {
|
||||
let calendar_service = CalendarService::new();
|
||||
@@ -1418,17 +1413,41 @@ pub fn App() -> Html {
|
||||
Ok(_) => {
|
||||
web_sys::console::log_1(&"Calendar created successfully!".into());
|
||||
refresh_calendars.emit(());
|
||||
create_modal_open.set(false);
|
||||
calendar_management_modal_open.set(false);
|
||||
}
|
||||
Err(err) => {
|
||||
web_sys::console::log_1(&format!("Failed to create calendar: {}", err).into());
|
||||
create_modal_open.set(false);
|
||||
calendar_management_modal_open.set(false);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
})}
|
||||
on_external_success={Callback::from({
|
||||
let external_calendars = external_calendars.clone();
|
||||
let calendar_management_modal_open = calendar_management_modal_open.clone();
|
||||
move |new_id: i32| {
|
||||
// Refresh external calendars list
|
||||
let external_calendars = external_calendars.clone();
|
||||
let calendar_management_modal_open = calendar_management_modal_open.clone();
|
||||
|
||||
wasm_bindgen_futures::spawn_local(async move {
|
||||
let calendar_service = CalendarService::new();
|
||||
match CalendarService::get_external_calendars().await {
|
||||
Ok(calendars) => {
|
||||
external_calendars.set(calendars);
|
||||
calendar_management_modal_open.set(false);
|
||||
web_sys::console::log_1(&format!("External calendar {} added successfully!", new_id).into());
|
||||
}
|
||||
Err(err) => {
|
||||
web_sys::console::error_1(&format!("Failed to refresh external calendars: {}", err).into());
|
||||
calendar_management_modal_open.set(false);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})}
|
||||
available_colors={available_colors.iter().map(|c| c.to_string()).collect::<Vec<_>>()}
|
||||
/>
|
||||
|
||||
@@ -1623,58 +1642,6 @@ pub fn App() -> Html {
|
||||
available_calendars={user_info.as_ref().map(|ui| ui.calendars.clone()).unwrap_or_default()}
|
||||
/>
|
||||
|
||||
<ExternalCalendarModal
|
||||
is_open={*external_calendar_modal_open}
|
||||
on_close={Callback::from({
|
||||
let external_calendar_modal_open = external_calendar_modal_open.clone();
|
||||
move |_| external_calendar_modal_open.set(false)
|
||||
})}
|
||||
on_success={Callback::from({
|
||||
let external_calendars = external_calendars.clone();
|
||||
let external_calendar_events = external_calendar_events.clone();
|
||||
move |new_calendar_id: i32| {
|
||||
let external_calendars = external_calendars.clone();
|
||||
let external_calendar_events = external_calendar_events.clone();
|
||||
wasm_bindgen_futures::spawn_local(async move {
|
||||
// First, refresh the calendar list to get the new calendar
|
||||
match CalendarService::get_external_calendars().await {
|
||||
Ok(calendars) => {
|
||||
external_calendars.set(calendars.clone());
|
||||
|
||||
// Then immediately fetch events for the new calendar if it's visible
|
||||
if let Some(new_calendar) = calendars.iter().find(|c| c.id == new_calendar_id) {
|
||||
if new_calendar.is_visible {
|
||||
match CalendarService::fetch_external_calendar_events(new_calendar_id).await {
|
||||
Ok(mut events) => {
|
||||
// Set calendar_path for color matching
|
||||
for event in &mut events {
|
||||
event.calendar_path = Some(format!("external_{}", new_calendar_id));
|
||||
}
|
||||
|
||||
// Add the new calendar's events to existing events
|
||||
let mut all_events = (*external_calendar_events).clone();
|
||||
all_events.extend(events);
|
||||
external_calendar_events.set(all_events);
|
||||
}
|
||||
Err(e) => {
|
||||
web_sys::console::log_1(
|
||||
&format!("Failed to fetch events for new calendar {}: {}", new_calendar_id, e).into(),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Err(err) => {
|
||||
web_sys::console::log_1(
|
||||
&format!("Failed to refresh calendars after creation: {}", err).into(),
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})}
|
||||
/>
|
||||
|
||||
<EventModal
|
||||
event={if *view_event_modal_open { (*view_event_modal_event).clone() } else { None }}
|
||||
|
||||
401
frontend/src/components/calendar_management_modal.rs
Normal file
401
frontend/src/components/calendar_management_modal.rs
Normal file
@@ -0,0 +1,401 @@
|
||||
use yew::prelude::*;
|
||||
use web_sys::HtmlInputElement;
|
||||
use wasm_bindgen::JsCast;
|
||||
use crate::services::calendar_service::CalendarService;
|
||||
|
||||
#[derive(Clone, PartialEq)]
|
||||
pub enum CalendarTab {
|
||||
Create,
|
||||
External,
|
||||
}
|
||||
|
||||
#[derive(Properties, PartialEq)]
|
||||
pub struct CalendarManagementModalProps {
|
||||
pub is_open: bool,
|
||||
pub on_close: Callback<()>,
|
||||
pub on_create_calendar: Callback<(String, Option<String>, Option<String>)>, // name, description, color
|
||||
pub on_external_success: Callback<i32>, // Pass the newly created external calendar ID
|
||||
pub available_colors: Vec<String>,
|
||||
}
|
||||
|
||||
#[function_component(CalendarManagementModal)]
|
||||
pub fn calendar_management_modal(props: &CalendarManagementModalProps) -> Html {
|
||||
let active_tab = use_state(|| CalendarTab::Create);
|
||||
|
||||
// Create Calendar state
|
||||
let calendar_name = use_state(|| String::new());
|
||||
let description = use_state(|| String::new());
|
||||
let selected_color = use_state(|| None::<String>);
|
||||
let create_error_message = use_state(|| None::<String>);
|
||||
let is_creating = use_state(|| false);
|
||||
|
||||
// External Calendar state
|
||||
let external_name_ref = use_node_ref();
|
||||
let external_url_ref = use_node_ref();
|
||||
let external_color_ref = use_node_ref();
|
||||
let external_is_loading = use_state(|| false);
|
||||
let external_error_message = use_state(|| None::<String>);
|
||||
|
||||
// Reset state when modal opens
|
||||
use_effect_with(props.is_open, {
|
||||
let calendar_name = calendar_name.clone();
|
||||
let description = description.clone();
|
||||
let selected_color = selected_color.clone();
|
||||
let create_error_message = create_error_message.clone();
|
||||
let is_creating = is_creating.clone();
|
||||
let external_is_loading = external_is_loading.clone();
|
||||
let external_error_message = external_error_message.clone();
|
||||
let active_tab = active_tab.clone();
|
||||
|
||||
move |is_open| {
|
||||
if *is_open {
|
||||
// Reset all state when modal opens
|
||||
calendar_name.set(String::new());
|
||||
description.set(String::new());
|
||||
selected_color.set(None);
|
||||
create_error_message.set(None);
|
||||
is_creating.set(false);
|
||||
external_is_loading.set(false);
|
||||
external_error_message.set(None);
|
||||
active_tab.set(CalendarTab::Create);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
let on_tab_click = {
|
||||
let active_tab = active_tab.clone();
|
||||
Callback::from(move |tab: CalendarTab| {
|
||||
active_tab.set(tab);
|
||||
})
|
||||
};
|
||||
|
||||
let on_backdrop_click = {
|
||||
let on_close = props.on_close.clone();
|
||||
Callback::from(move |e: MouseEvent| {
|
||||
if let Some(target) = e.target() {
|
||||
let element = target.dyn_into::<web_sys::Element>().unwrap();
|
||||
if element.class_list().contains("modal-backdrop") {
|
||||
on_close.emit(());
|
||||
}
|
||||
}
|
||||
})
|
||||
};
|
||||
|
||||
// Create Calendar handlers
|
||||
let on_name_change = {
|
||||
let calendar_name = calendar_name.clone();
|
||||
Callback::from(move |e: InputEvent| {
|
||||
let input: HtmlInputElement = e.target_unchecked_into();
|
||||
calendar_name.set(input.value());
|
||||
})
|
||||
};
|
||||
|
||||
let on_description_change = {
|
||||
let description = description.clone();
|
||||
Callback::from(move |e: InputEvent| {
|
||||
let input: web_sys::HtmlTextAreaElement = e.target_unchecked_into();
|
||||
description.set(input.value());
|
||||
})
|
||||
};
|
||||
|
||||
let on_color_select = {
|
||||
let selected_color = selected_color.clone();
|
||||
Callback::from(move |color: String| {
|
||||
selected_color.set(Some(color));
|
||||
})
|
||||
};
|
||||
|
||||
let on_create_submit = {
|
||||
let calendar_name = calendar_name.clone();
|
||||
let description = description.clone();
|
||||
let selected_color = selected_color.clone();
|
||||
let create_error_message = create_error_message.clone();
|
||||
let is_creating = is_creating.clone();
|
||||
let on_create_calendar = props.on_create_calendar.clone();
|
||||
|
||||
Callback::from(move |e: SubmitEvent| {
|
||||
e.prevent_default();
|
||||
|
||||
let name = (*calendar_name).trim();
|
||||
if name.is_empty() {
|
||||
create_error_message.set(Some("Calendar name is required".to_string()));
|
||||
return;
|
||||
}
|
||||
|
||||
is_creating.set(true);
|
||||
create_error_message.set(None);
|
||||
|
||||
let desc = if description.is_empty() {
|
||||
None
|
||||
} else {
|
||||
Some((*description).clone())
|
||||
};
|
||||
|
||||
on_create_calendar.emit((name.to_string(), desc, (*selected_color).clone()));
|
||||
})
|
||||
};
|
||||
|
||||
// External Calendar handlers
|
||||
let on_external_submit = {
|
||||
let external_name_ref = external_name_ref.clone();
|
||||
let external_url_ref = external_url_ref.clone();
|
||||
let external_color_ref = external_color_ref.clone();
|
||||
let external_is_loading = external_is_loading.clone();
|
||||
let external_error_message = external_error_message.clone();
|
||||
let on_close = props.on_close.clone();
|
||||
let on_external_success = props.on_external_success.clone();
|
||||
|
||||
Callback::from(move |e: SubmitEvent| {
|
||||
e.prevent_default();
|
||||
|
||||
let name = external_name_ref
|
||||
.cast::<HtmlInputElement>()
|
||||
.map(|input| input.value())
|
||||
.unwrap_or_default()
|
||||
.trim()
|
||||
.to_string();
|
||||
|
||||
let url = external_url_ref
|
||||
.cast::<HtmlInputElement>()
|
||||
.map(|input| input.value())
|
||||
.unwrap_or_default()
|
||||
.trim()
|
||||
.to_string();
|
||||
|
||||
let color = external_color_ref
|
||||
.cast::<HtmlInputElement>()
|
||||
.map(|input| input.value())
|
||||
.unwrap_or_else(|| "#4285f4".to_string());
|
||||
|
||||
if name.is_empty() || url.is_empty() {
|
||||
external_error_message.set(Some("Name and URL are required".to_string()));
|
||||
return;
|
||||
}
|
||||
|
||||
external_is_loading.set(true);
|
||||
external_error_message.set(None);
|
||||
|
||||
let external_is_loading = external_is_loading.clone();
|
||||
let external_error_message = external_error_message.clone();
|
||||
let on_close = on_close.clone();
|
||||
let on_external_success = on_external_success.clone();
|
||||
|
||||
wasm_bindgen_futures::spawn_local(async move {
|
||||
let calendar_service = CalendarService::new();
|
||||
|
||||
match CalendarService::create_external_calendar(&name, &url, &color).await {
|
||||
Ok(calendar) => {
|
||||
external_is_loading.set(false);
|
||||
on_close.emit(());
|
||||
on_external_success.emit(calendar.id);
|
||||
}
|
||||
Err(e) => {
|
||||
external_is_loading.set(false);
|
||||
external_error_message.set(Some(format!("Failed to add calendar: {}", e)));
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
};
|
||||
|
||||
if !props.is_open {
|
||||
return html! {};
|
||||
}
|
||||
|
||||
html! {
|
||||
<div class="modal-backdrop" onclick={on_backdrop_click}>
|
||||
<div class="modal-content calendar-management-modal">
|
||||
<div class="modal-header">
|
||||
<h2>{"Add Calendar"}</h2>
|
||||
<button class="modal-close" onclick={
|
||||
let on_close = props.on_close.clone();
|
||||
Callback::from(move |_: MouseEvent| on_close.emit(()))
|
||||
}>{"×"}</button>
|
||||
</div>
|
||||
|
||||
<div class="calendar-management-tabs">
|
||||
<button
|
||||
class={if *active_tab == CalendarTab::Create { "tab-button active" } else { "tab-button" }}
|
||||
onclick={
|
||||
let on_tab_click = on_tab_click.clone();
|
||||
Callback::from(move |_: MouseEvent| on_tab_click.emit(CalendarTab::Create))
|
||||
}
|
||||
>
|
||||
{"Create Calendar"}
|
||||
</button>
|
||||
<button
|
||||
class={if *active_tab == CalendarTab::External { "tab-button active" } else { "tab-button" }}
|
||||
onclick={
|
||||
let on_tab_click = on_tab_click.clone();
|
||||
Callback::from(move |_: MouseEvent| on_tab_click.emit(CalendarTab::External))
|
||||
}
|
||||
>
|
||||
{"Add External"}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
{
|
||||
match *active_tab {
|
||||
CalendarTab::Create => html! {
|
||||
<form onsubmit={on_create_submit}>
|
||||
<div class="form-group">
|
||||
<label for="calendar-name">{"Calendar Name"}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="calendar-name"
|
||||
value={(*calendar_name).clone()}
|
||||
oninput={on_name_change}
|
||||
placeholder="Enter calendar name"
|
||||
disabled={*is_creating}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="calendar-description">{"Description (optional)"}</label>
|
||||
<textarea
|
||||
id="calendar-description"
|
||||
value={(*description).clone()}
|
||||
oninput={on_description_change}
|
||||
placeholder="Enter calendar description"
|
||||
disabled={*is_creating}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label>{"Calendar Color"}</label>
|
||||
<div class="color-picker">
|
||||
{
|
||||
props.available_colors.iter().map(|color| {
|
||||
let is_selected = selected_color.as_ref() == Some(color);
|
||||
let color_clone = color.clone();
|
||||
let on_color_select = on_color_select.clone();
|
||||
|
||||
html! {
|
||||
<div
|
||||
key={color.clone()}
|
||||
class={if is_selected { "color-option selected" } else { "color-option" }}
|
||||
style={format!("background-color: {}", color)}
|
||||
onclick={Callback::from(move |_: MouseEvent| {
|
||||
on_color_select.emit(color_clone.clone());
|
||||
})}
|
||||
/>
|
||||
}
|
||||
}).collect::<Html>()
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{
|
||||
if let Some(ref error) = *create_error_message {
|
||||
html! {
|
||||
<div class="error-message">
|
||||
{error}
|
||||
</div>
|
||||
}
|
||||
} else {
|
||||
html! {}
|
||||
}
|
||||
}
|
||||
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="button"
|
||||
class="cancel-button"
|
||||
onclick={
|
||||
let on_close = props.on_close.clone();
|
||||
Callback::from(move |_: MouseEvent| on_close.emit(()))
|
||||
}
|
||||
disabled={*is_creating}
|
||||
>
|
||||
{"Cancel"}
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="create-button"
|
||||
disabled={*is_creating}
|
||||
>
|
||||
{if *is_creating { "Creating..." } else { "Create Calendar" }}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
},
|
||||
CalendarTab::External => html! {
|
||||
<form onsubmit={on_external_submit}>
|
||||
<div class="form-group">
|
||||
<label for="external-name">{"Calendar Name"}</label>
|
||||
<input
|
||||
type="text"
|
||||
id="external-name"
|
||||
ref={external_name_ref.clone()}
|
||||
placeholder="Enter calendar name"
|
||||
disabled={*external_is_loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="external-url">{"Calendar URL"}</label>
|
||||
<input
|
||||
type="url"
|
||||
id="external-url"
|
||||
ref={external_url_ref.clone()}
|
||||
placeholder="https://example.com/calendar.ics"
|
||||
disabled={*external_is_loading}
|
||||
/>
|
||||
<small class="help-text">
|
||||
{"Enter the ICS/CalDAV URL for your external calendar"}
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="external-color">{"Calendar Color"}</label>
|
||||
<input
|
||||
type="color"
|
||||
id="external-color"
|
||||
ref={external_color_ref.clone()}
|
||||
value="#4285f4"
|
||||
disabled={*external_is_loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
{
|
||||
if let Some(ref error) = *external_error_message {
|
||||
html! {
|
||||
<div class="error-message">
|
||||
{error}
|
||||
</div>
|
||||
}
|
||||
} else {
|
||||
html! {}
|
||||
}
|
||||
}
|
||||
|
||||
<div class="modal-footer">
|
||||
<button
|
||||
type="button"
|
||||
class="cancel-button"
|
||||
onclick={
|
||||
let on_close = props.on_close.clone();
|
||||
Callback::from(move |_: MouseEvent| on_close.emit(()))
|
||||
}
|
||||
disabled={*external_is_loading}
|
||||
>
|
||||
{"Cancel"}
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
class="create-button"
|
||||
disabled={*external_is_loading}
|
||||
>
|
||||
{if *external_is_loading { "Adding..." } else { "Add Calendar" }}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
}
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
@@ -1,5 +1,6 @@
|
||||
pub mod calendar;
|
||||
pub mod calendar_context_menu;
|
||||
pub mod calendar_management_modal;
|
||||
pub mod calendar_header;
|
||||
pub mod calendar_list_item;
|
||||
pub mod context_menu;
|
||||
@@ -19,16 +20,15 @@ pub mod week_view;
|
||||
|
||||
pub use calendar::Calendar;
|
||||
pub use calendar_context_menu::CalendarContextMenu;
|
||||
pub use calendar_management_modal::CalendarManagementModal;
|
||||
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;
|
||||
// Re-export event form types for backwards compatibility
|
||||
pub use event_form::EventCreationData;
|
||||
pub use event_context_menu::{DeleteAction, EditAction, EventContextMenu};
|
||||
pub use event_modal::EventModal;
|
||||
pub use external_calendar_modal::ExternalCalendarModal;
|
||||
pub use login::Login;
|
||||
pub use mobile_warning_modal::MobileWarningModal;
|
||||
pub use month_view::MonthView;
|
||||
|
||||
@@ -100,8 +100,7 @@ impl Default for ViewMode {
|
||||
pub struct SidebarProps {
|
||||
pub user_info: Option<UserInfo>,
|
||||
pub on_logout: Callback<()>,
|
||||
pub on_create_calendar: Callback<()>,
|
||||
pub on_create_external_calendar: Callback<()>,
|
||||
pub on_add_calendar: Callback<()>,
|
||||
pub external_calendars: Vec<ExternalCalendar>,
|
||||
pub on_external_calendar_toggle: Callback<i32>,
|
||||
pub on_external_calendar_delete: Callback<i32>,
|
||||
@@ -357,12 +356,8 @@ pub fn sidebar(props: &SidebarProps) -> Html {
|
||||
</div>
|
||||
|
||||
<div class="sidebar-footer">
|
||||
<button onclick={props.on_create_calendar.reform(|_| ())} class="create-calendar-button">
|
||||
{"+ Create Calendar"}
|
||||
</button>
|
||||
|
||||
<button onclick={props.on_create_external_calendar.reform(|_| ())} class="create-external-calendar-button">
|
||||
{"+ Add External Calendar"}
|
||||
<button onclick={props.on_add_calendar.reform(|_| ())} class="add-calendar-button">
|
||||
{"+ Add Calendar"}
|
||||
</button>
|
||||
|
||||
<div class="view-selector">
|
||||
|
||||
Reference in New Issue
Block a user